Vue基础知识学习（后端）

### Vue学习（后端）

Vue安装

-引入文件安装，直接在官网下载vue.js引入项目中
-直接引用CDN
-NPM安装（构建大型应用使用，在这不用）
-命令行工具（构建大型单页应用，在这不用）

Vue基本代码结构

{{msg}}

指令1：v-text,v-html，显示文本内容

    

    



区别：
v-html中的数据原样显示
v-html中的数据可能会被转义，比如
这是h2的内容
会被当成html代码

指令2：v-on，绑定事件指令

    



简写：
v-on指令可以简写为  @ ， 例如  v-on:click=”show”   简写为  @click=”show”

指令3：v-bind，属性绑定

    
属性绑定


简写：
v-bind:指令可以简写为  : ， 例如  v-bind:title=”title” 简写为：:title=”title”  

指令4：v-model,双向数据绑定

    
    
{{content}}

侦听器：监听某个数据发生变化

    
    
{{content}}

初始化页面完成后渲染数据 mounted

指令5：v-show,v-if，显示与隐藏

    点击切换
    
{{content}}

区别：v-if隐藏时移除dom，v-show隐藏时hiden，频繁隐藏显示时v-show比较好

指令6：v-for，循环

    

            v-for指令：
            
 
                
{{item}}
            
        

转载于:https://www.cnblogs.com/alisleepy/p/11200355.html