-
条件渲染if
查看全部 -
watch常用监听一个变量,可以是个数组;
computed监听多个变量,必须在vue实例中。
查看全部 -
调试的一些方法总结:
查看全部 -
state 组件的一个状态
mutations 唯一一个可以改变vuex的状态的方法集,所有的方法都放在这里面
使用vuex的过程:
①定义一个store.js文件
②定义state(组件公用的状态)和mutations(定义改变状态的一些方法)
③在组件中使用,首先引入store.js文件 import store from '@/store',
然后再export default{}里面引用store
④在组件里面怎样提交修改 store.commit()
理解:vuex当做一个中央管理处,给它提交一个申请,我这个地方有个状态需要变化;那么它收到这个申请之后,就去改变这个状态,然后通知到每个要使用这个状态的组件
查看全部 -
Vuex介绍
查看全部 -
vue模板语法
查看全部 -
vue代码规范,风格指南
查看全部 -
组件化思想
一.什么是组件化?--一个组件相当于一个模块,独立的,可复用的,包含整个页面上所需要的业务逻辑和样式的;
①独立的
②可复用的
③整体化的
二.为什么要组件化?
①实现功能模块的复用
②高执行效率
③开发单页面复杂应用
三.如何进行拆分?
①300行原则:整个组件包括样式,业务代码尽量控制少一点,方便维护
②复用原则:组件经常使用,比如头部的导航,底部的版权信息,侧边栏这些经常需要复用的,像这样的模块可以进行一个拆分
③业务复杂性原则:
四.组件化带来的问题
①组件状态管理(vuex)
②多组件的混合使用,多页面,复杂业务(vue-router)
③组件间的传参,消息,事件管理(props,emit/on,bus)
查看全部 -
总结一下这章??
查看全部 -
vue create hello-wold 创建项目
可以使用短横线或下横线,小写的英文字母去创建一个项目
查看全部 -
class和style
查看全部 -
watch和computed的区别:
watch通常来说监听的事一个变量或一个常量的变化
computed可以监听很多个变量,但是这个变量一定是在vue的实例里面的;
查看全部 -
实例外定义变量,比较特别,在控制台直接修改arr = '123';msg1的值在页面上不会改变;这个时候,对实例app.msg赋值,computed会重新计算渲染,这个时候arr改变后的值会回到页面上.
查看全部 -
监听 watch
查看全部 -
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <div class="bg"> hello world!! </br> {{msg}} {{count}} </div> <div v-html="template"> <div>成都今天的天气是19度,2019-05-30</div> </div> <div v-if="count > 0"> count大于0,count的值:{{count}} </div> <div v-else=""> count小于0,count的值:{{count}} </div> <!--v-for--> <div v-for="item of list" > {{item}} </div> <div v-for="item of list" > {{item}} </div> <div v-for="item of tempArr" v-bind: :class="{'active': true}}"> {{item.name}}--{{item.age}} </div> </div> <script src="https://cdn.jsdelivr.net/npm/vue"></script> <script> new Vue({ el: '#app', data: { msg: "hello word", styleMsg: { color: 'red', textShadow: '0 0 5px #232323', }, count: 0, template: `<div>成都今天的天气是19度,2019-05-30</div>`, list: [1,2,3,4,5], tempArr: [{'name': '张三', age: '22岁'},{'name': '历史', age: '18岁'},{'name': '王五', age: '16岁'}] } }) </script> </body> </html>
查看全部
举报