Vue.js中“{{}}”的用法
用户投稿 学习笔记 22阅读
Vue.js核心库只关注视图层，而我们只需要注重数据的操作就好，通过接下来的学习会更深的理解这句话，vue.js通过很多指令和修饰符来完成对视图的关注，第一个是{{}}
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="./vue.js"></script> <!-- 使用vue.js需要先使用 --></head><body> <div id="root"> <!-- 可以直接写变量--> {{userName}} <!-- 可以写三元表达式 --> {{true?'男':'女'}} <!-- 可以调用函数 功能是倒叙--> {{userName.split("").reverse().join("")}} </div></body><script> new Vue({ el:'#root',//挂载的元素，只有在这个区域内才能使用Vue data:{ userName:'仓央嘉措', sex:"男"， num:1, src:'http://img0.imgtn.bdimg.com/it/u=4150802370,1902002068&fm=11&gp=0.jpg', str:'我是一只小小小鸟' },//变量定义在里面 methods:{},//方法定义在这里面 filters:{},//过滤器 components:{},//组件 computed:{}//计算属性 })</script></html>执行结果：
标签：