npm简单指令
设置npm 的淘宝镜像
npm config set registry registry.npm.taobao.org/ #设置淘宝镜像地址
npm config get registry #查看镜像地址 全局安装脚手架指令 npm install -g @vue/cli 检查是否安装成功指令,如果可以看见版本就是安装成功 vue --version
创建项目指令
vue create 文件名 1.进入项目 2.启动查看效果
- cd 项目名 进入项目界面
- npm run serve 启动查看效果
项目打包
npm run build
vue基础指令
v-on： v-on可以简写成 @。 即 @事件名="methods中的函数" 修饰符 。stop阻止事件冒泡 .prevent阻止默认行为 .once 程序运行期间，只触发一次事件处理函数
- <标签 v-on:事件名="要执行的少量代码/methods中的函数/methods中的函数（实参）" >
v-model: 双向绑定 .number 以parseFloat转成数字类型 .trim 去除首尾空白字符 .lazy 在失去焦点时触发更改而非inupt时
<标签 v-model="value"></标签>
v-for 列表渲染，，循环，索引值可以省略，目标结构可以是：数组/对象/数字
<标签 v-for="(值, 索引或者属性名) in 目标结构" :key="唯一值"></标签>
v-text : v-text把值当成普通字符串显示, v-text ===> innerText
v-text="vue数据变量"
v-html： v-html把值当做html解析,v-html ===> innerHTML
v-html="vue数据变量"
v-if:变量为true可见，反之不可 - v-if 直接从DOM树上添加或移除
- <标签 v-if="vue变量" />
v-show:变量为true可见，反之不可 v-show用的display:none影藏（频繁切换使用）
- <标签 v-show="vue变量" />
v-if,v-else-if,v-else
<标签 v-if="条件"> </标签> <标签 v-else-if="条件"> </标签> <标签 v-else-if="条件"> </标签> <标签 v-else> </标签>
v-bind 用来动态绑定标签上的属性值 简写用法 ：冒号
<元素 v-bind:属性名1="值1" v-bind:属性名2="值2"></元素> // 简写, 省略v-bind <元素 :属性名1="值1" :属性名2="值2"></元素>
