-
挂载点:指的是el标记的
模板:既可以写在挂载点内部,也可以写在js的template里面
查看全部 -
1.计算属性:computed,computed中的属性所对应的值是通过其他属性计算而来.性能很高.
fullName:他是通过计算而来的属性,所以不需要在data中定义,而是通过Vue实例配置对象里面computed这个属性,该属性中定义一个fullName属性,fullName属性对应的是一个函数,该函数返回一个数据,这是数据是通过别的属性计算而来.计算属性fullName的性能是很高的,如果他依赖的属性不变那么会直接使用缓存中的原有计算值.
2,侦听器 作用,侦听某一个数据的变化(可以是data中的属性,也可以箭筒计算属性例如:fullName),一旦被侦听数据有变化就被侦听到
查看全部 -
模板指令(v-bind等) 等号后面的""中是js表达式
v-bind:title="title" //"title"是一个js表达式
查看全部 -
模板指令:
v-if 控制dom中元素的存在或删除
v-show控制dom中元素是否显示
v-if:例如:v-if="show",当v-if对应的数据项'show'为false时,那么具有v-if='show'的标签将会在dom中移出,
v-show:例如:v-show="show",当v-show对应的数据项'show'为false时,那么具有v-show='show'的标签bu会在dom中移出,只是给该标签增加了一个display:none的css属性
应用场景,如果这个隐藏显示的标签使用频率不大,那么用v-if,如果使用频率很高用v-show
v-for:
v-for的作用:当有一个数据需要循环展示时
v-for='item of list'意思是:循环数据列表list,每次循环的内容放到item中.
为了提升数据列表中每一项数据的渲染性能,通常会在需要使用指令的元素中增加:key属性,但是:key属性的值需要保证唯一性.所以我们需要v-for="(item,index) of list",这样写,意思是循环list数据列表,循环出的数据放到item中,循环的是第几项他的下标放到index中.同时使用下标为:key的值.
<li v-for="(item,index) of list" :key="index">{{item}}</li>
查看全部 -
scoped 样式修饰符:保证所加的样式只对当前组件起作用,不会影响其它组件样式。
去掉的话,会对全局的组件样式有影响
查看全部 -
创建vue实例:new Vue({}),创建完,在new Vue({})实例中,传递几个对象参数在{}中,其中{el:'#root',data;{}}el的作用是,vue实例和dom中的那个节点做绑定.其中data就是vue实例中的一些数据,
查看全部 -
计算属性用computed,侦听属性用watch.
查看全部 -
v-on可以用@代替
v-bind可以用:代替,单项传递
v-model双向传递
查看全部 -
在数量较少的显示/隐藏展示中,用v-if会比较好
反之,较多时则是使用v-show比较好
v-if是将div中的代码不断的删除/回复
v-show则是给代码添加display的css标签
查看全部 -
每次循环中的key值不能相同
查看全部 -
<div id="root"></div> <script> new Vue({ el:"#root", template:'<h1>Hello {{msg}}</h1>', data:{ msg:" World" } }) </script>
//挂载点: Vue托管的html标签,只有在托管的标签中才能引用Vue的内容。
//模板: 挂载点内部的内容称为模板内容,托管标签里的子标签可以写到html里,也可以写到template对应的值里。
//实例: 实例只需指定一个挂载点和模板内容,Vue就会把实例和数据内容综合后渲染到挂载点里面。
查看全部 -
//引入Vue的方式,el表示Vue托管html标签,
//托管后{{}}显示Vue的内容
<div id="root">{{msg}}</div> <script> new Vue({ el:"#root", data:{ msg:"Hello World" } } ) </script>
查看全部 -
组件怎么设置样式?查看全部
-
操作数据,操作数据查看全部
-
v-for 循环数据,v-bind:key=item查看全部
举报