向所有抗争不公命运的力量致敬!
http://127.0.0.1/001/
001/index.html base
001/index2.html v-model="name" 绑定值; 是否显示 v-show='age'(display:none) 或 v-if='sex';(直接删除dom)
001/index3.html v-for
001/index4.html v-bind:href="paraInJS" 简写 :href="paraInJS"
001/index5.html v-on:click="fnInJS";
简写做 @:click="fnInJS";
写多个动作v-on="{mouseenter:onEnter, mouseleave:onOut}";
v-on:submit="onSubmit;v-on:submit.stop="onSubmit;v-on:submit.prevent="onSubmit;; v-on:submit="onSubmit($event); v-on:submit.prevent="onSubmit($event)
001/index6.html v-model模型用于和input双向数据绑定: v-model="name";
鼠标移开才更新 v-model.lazy="name";
去掉头尾的空格 v-model.trim="name";
只能输入数字 v-model.number="name"
其他元素和类型上使用model: input type="radio";input type="checkbox"; select; textarea;
001/index7.html vue控制流 v-if
001/index8.html vue计算属性 computed:{ value2:function(){} }定义键,值是带返回值的匿名函数; 使用{{ value2 }}
001/index9.html vue方法 methods:{fn:function(){}}; 使用{{fn()}}
001/index10.html vue全局及局部组件:
001/index11.html 组件-配置组件:
001/index12.html 组件的通信
001/index12_2.html 组件的通信: 父级组件给子组件传参,通过自定义属性,从外向内传(html to js)
001/index12_3.html 组件的通信: 子级组件给父组件传参,
001/index12_4.html 组件的通信: 子级组件给父组件传参,通过事件通信,子组件触发父组件事件,同时传参
001/index13.html 组件的通信: 组件通信之任意及平行组件间通信:调度器
001/index14.html 过滤器
001/index15.html 自定义指令 - 基础配置
001/index15_2.html 自定义指令 - 修饰符及传参
001/index16.html mixin: 组件内部可以使用@mouseenter="visible=true" 调用自己的数据visible
001/index16_2.html mixin: 组件内调用方法@mouseenter="show" 访问数据
001/index16_3.html mixins 混合 - v3使用mixin减少重复代码,优先级(自定义会覆盖掉mixin)
001/index17.html slots 插槽 - 基本slot
001/index17_2.html slots 插槽 - 带名字的 slot(特别常用,可以把一个组件套到另一个组件中)
https://study.163.com/course/courseLearn.htm?courseId=1004181065 https://study.163.com/course/courseLearn.htm?courseId=1004181065#/learn/video?lessonId=1048299100&courseId=1004181065 mixin https://study.163.com/course/courseLearn.htm?courseId=1004181065#/learn/video?lessonId=1048297109&courseId=1004181065