不复习不知道,一复习发现很多细节性问题,脑子里只有知识点大概的想法,却没有详细的概念,这就是基础知识不牢靠的原因。

- - 复习了半个多月,最近无意间翻到自己之前入门vue的Demo

1、首先了解一些vue基础语法

 插值表达式{{}} 可以写其他内容
 v-cloak  

 v-text  会覆盖元标签内容 2可以直接渲染不用标签v-cloak  直接显示值

 v-html   将文本解析成html

 v-bind  对标签的属性进行绑定 简写形式 :

  按钮

 JQ 操作dmo  prop对标签属性绑定 .prop("value","按钮")

 v-on:click=    绑定事件  简写形式@

 v-model=      双向绑定  适用于标签中有value 一条标签只能使用一次 多次使用会不知道 绑定那个v-model

 :class 绑定样式 1、绑定数组 2、三元表达式 3、数组嵌套

 :style   1、键值对写法 2、键值对对象json格式 多个data可以使用数组 []接收

 v- for    循环四种对象 1、普通数组  2、对象数组 3、对象 4、迭代数字 5、默认以索引绑定当前,需要使用Key属性改变默认设置

 v-if     销毁标签

 v-show   隐藏标签

2、搭建项目 - -(脚手架)

- -新手学习语法的时候不推荐使用脚手架,因为有严格的语法检查,会报错

Vue-cli 安装

1.安装环境 cnpm -- 使用淘宝镜像 快一点 (如果你有科学方法当我没说)

npm install -g cnpm --registry=https://registry.npm.taobao.org

2. 安装vue-cli

 cnpm install vue -cli -g  // 3.0 以前 (不包含3.0)

 cnpm install @vue/cli -g // 3.0 及以后 

3.初始化项目

 vue init webpack 项目名称   // 3.0 以前 (不包含3.0)

 vue create 项目名称         // 3.0 及以后 

4.进入项目目录,安装模块

  cd 项目名称

  cnpm install 

5.启动项目

 cnpm run dev

3、DEOM

  • 未使用 脚手架
  • 直接引用 vue.js

1. 双向绑定

运行结果

  • 主题内插件冲突 所以显示不完全,具体效果参考:
  • 地址

2.Table 增加 删除

1. HTML 部分