-
为什么要组件化
查看全部 -
什么是组件化
查看全部 -
<div v-on:click="submit()">v-on绑定事件,可用@代替</div>
<a v-bind:href="url"> v-bind绑定属性,可用:省略代替</a>
页面加载是出现闪烁的处理办法:
1⃣️ <div v-cloak>{{msg}} --- {{age}}</div> [v-cloak]{ diaplay:none; }
2⃣️ <div v-html="template"></div> // v-html可输出原始代码
3⃣️ <div v-text="content"></div> // v-text进行转译
<div v-if="count >0">判断1</div>
<div v-else-if="count<0 && count >-5">判断2</div>
<div v-else>判断3</div>
显示<div v-show="count==0">show</div>
<div v-for="item in list">{{item}}</div>
<div :class="['active','add','more',{'another':item.age>20}]" ></div>
//绑定active add more 以及判断条件item.age大于成真才会显示四个样式,否则显示三个
<input v-model="message" />
<span v-once>一次性插值,这个数值不会被改变{{msg}}</span>
查看全部 -
使用场景
watch(异步场景)
computed(数据联动)
computed和watch的区别
computed特性
1.是计算值,
2.应用:就是简化tempalte里面{{}}计算和处理props或$emit的传值
3.具有缓存性,页面重新渲染值不变化,计算属性会立即返回之前的计算结果,而不必再次执行函数
watch特性
1.是观察的动作,
2.应用:监听props,$emit或本组件的值执行异步操作
3.无缓存性,页面重新渲染时值不变化也会执行
查看全部 -
侦听器,区别 compute会侦听包含的所有变量。watch侦听一个
watch:{
msg:function(newVal.oldVal){
}
}
compute:{
}
查看全部 -
指令 v-html v-bind
还可以缩写 绑定事假 on-cllik 写成 @click on-bind:href 写成 :href=""
查看全部 -
调试方法总结
查看全部 -
watch 与 computed 的区别
查看全部 -
vue工具套装
查看全部 -
总结的...
查看全部 -
vue-cli安装及使用:
检查node和npm版本,node -v,npm -v,node版本要在8以上,npm版本要在6以上;
安装vue-cli:npm install -g @vue/cli ;
查看安装版本 vue --version ;
创建工程方法一:
①vue create project-name (project-name可使用短横线-、下横线_和小写字母);
②可用箭头选择是自动默认版本还是手动版本;
创建工程方法二:
①vue ui
②创建项目
node-sass是自动编译实时的
dart-sass需要保存后才会生效
查看全部 -
node开发环境
npm --version/-v //查看npm的版本
node --version/-v //查看node的版本
nvm //node多版本管理工具
nvm list //查看本地版本
nvm --help // 查看帮助
nvm list available //可以看node可用版本
nvm install +版本号 //下载node版本
nvm use +版本号 //使用哪个版本
vue
npm i -g vue-cli //下载vue工具
查看全部 -
时间的计划
查看全部 -
课程知识点
查看全部 -
学习的方法
查看全部
举报