浏览模式: 普通 | 列表
<< | < | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | > | >>

Vue3使用axios的教程

[ 2022-05-10 15:58:46 | 作者: admin ]
axios中文网站：axios-http.com/zh/

阅读全文…

分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 380

vue3创建的项目中使用vant UI组件库toast轻提示

[ 2022-05-10 15:02:57 | 作者: admin ]
PS：在使用过程中发现个小细节，在main.js中use的时候写的是Toast（大写的），在组件中this.$Toast ( ) 是 获 取 不 到 的 ，得小写的this.$toast()


从vant中引入Toast，再createApp().use(Toast)，这是在项目中main.js内的代码，是全局引入的方式
attachments/202205/10_150401_af9de62d7efe42a1a314105d49b96532.png


文档中是直接使用
Toast("弹出对话框"); //组件中提示错误
而在实际项目中，全局引入之后，在组件中直接使用Toast()是会报undefined的，找度娘帮忙之后发现，vue3里面是需要this.来获取的，即
this.$toast(“弹出对话框”); //注意小写
...

阅读全文…
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 707

Vue3 (@Vue/cli) 项目修改项目名的方法，目的就是重建 node_modules

[ 2022-05-09 16:32:30 | 作者: admin ]
一、直接修改目录名
1.删除 node_modules 文件夹
2.修改项目名称(项目文件夹名称)，并在package.json中修改对应的name
3.重新安装依赖 npm install
4.启动项目 npm run serve


二、新建一个项目，然后复制老的项目文件到新文件夹
1、vue create 新文件夹
2、cd 新文件夹 ，然后安装依赖的组件，如 vant、babel、less
3、把老的项目文件夹下的所有文件（除了node_modules），都复制到新项目文件夹下，并在package.json中修改对应的name
4、启动项目 npm run serve
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 455

vue3中vant ui框架按需加载的配置方法

[ 2022-05-08 22:49:18 | 作者: admin ]
1、务必先下载安装vant组件，不要忘记
cnpm i vant -S

2、下载按需加载的插件babel
cnpm i babel-plugin-import -D


3、babel.config.js 中配置
module.exports = {
     presets: ['@vue/cli-plugin-babel/preset'],
     plugins: [
         [
             'import',
             {
                libraryName: 'vant',
                libraryDirectory: 'es',
                style: true
             },
             'vant'
         ]
     ]
}



4、main.js 文件中加载需要的vant组件成员[code][/code]...

阅读全文…
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 485

win7下面安装node.js、cnpm、vue3

[ 2022-05-08 16:02:17 | 作者: admin ]
一、win7下面安装 node.js
win7下面的node.js最高可以安装node.js 13，不过node13没有办法安装vue3，所以只能选择node12，
亲测可以安装node.js 12.22.8 https://nodejs.org/download/release/v12.22.8/

二、win7下面安装 vue3
npm install -g cnpm --registry=https://registry.npm.taobao.org //改为淘宝镜像 安装cnpm
cnpm install vue //安装vue
cnpm install -g @vue/cli //安装全局vue-cli脚手架 , vue3的脚手架
cnpm install -g webpack //若没有安装webpack，则先安装webpack
...

阅读全文…
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 400

vue3中父组件和子组件模块相互传递参数最常用方法：关于$emit 和 props 的用法

[ 2022-05-07 21:54:20 | 作者: admin ]
1、父组件数据传给子组件： props2、子组件可以使用 $emit 让父组件监听到自定义事件 。vm.$emit( event, 参数 ) //触发当前实例上的事件vm.$on( event, fn ); //监听event事件后运行 fn例如：子组件：<template> <div> <h3>父组件传给子组件的toCity:{{sendData}}</h3> <br/><button@click="select('大连')">点击此处将‘大连’传给父组件</button> &nb...

阅读全文…
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 525

Vue父子组件模块参数传值的几种方法

[ 2022-05-07 21:21:20 | 作者: admin ]
1.父向子传值，子组件使用props父组件：<child:inputName="name">子组件：（1）props:{ inputName:String, required:true }（2）props:["inputName"]2.子向父传值，子组件使用$emit子组件:...

阅读全文…
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 356

关于模块化开发 require 、export、module.exports、exports

[ 2022-05-07 13:01:25 | 作者: admin ]
在模块化开发过程中经常遇到模块的导出导入。涉及到require 、export、module.exports、exports这些关键词。但是其中究竟有什么区别。自己还真的经常弄糊涂。索性自己好好缕一缕。首先呢，总体上区分两大规范CommonJS模块规范和ES6模块规范require： 阅读全文…
分类: Vue.js | 永久链接 | 评论: 0 | 引用: 0 | 浏览: 321
<< | < | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | > | >>