window.localStorage.gettItem("someItem"||[])//如果localStorage中的someItem不存在就返回一个空数组
window.localStorage.setItem("someItem",someValue)//向localStrorage中存入一个便变量 someItem
const ES6的规范 定义一个常量
export 相当于 model.export() 就是导出这个对象
//导出的方法放在这里
export default{ save(){ //return sonmething; }
//ES6d的语法，定义一个方法 相当于save:function(){//return sonmething;} vue推荐使用save(){//return sonmething;}
}
//导入方法import
import store form './store' ES6的语法 相当于 import store form './store.vue'
这样就可以使用store中的方法 store.someMethod
watch
handler
deep
划分组件
功能模块：
select pagenation
页面区域 header footer sidebar
Vuejs组件之间的调用------另外一个重要选项 components
import Header form './header'
只导入组件还是不能使用，需要组件注册
import Header form './header' import Header form './myFirstComponent' new Vue({ components:{ Header,myFirstComponent//组件注册 ，会后就可以在当前页面使用header组件了 tip:在html中vue会把驼峰写法改成小写加-的写法 } });
使用：
<header></header> <my-first-component></my-first-component>
Vuejs之间的通信 -----props 父组件向子组件传递c参数
自定义事件------子组件向父组件传递参数
子模板 componentA
<template>
<button v-on:click="doSthing">子组件</button>
</template>
exports default({
data:function(){
return{
ms："this is a componentA"
}
},
methods:{
props:['msg'],//接受从父组件传递过来的参数 msg
doSomething:function{
console.log(this.msg);
//触发自定义事件
this.$emit('childTellMeSomething',this.msg);
}
}
});
父组件 调用子组件
import componentA from 'component' //假定父组件与子组件在同一级目录下
<h2>child tell me:{{childWords}}</h2>
<component-a v-model:msg="tell child something" v-on:childTellMeSomething='listenToMyboy'></component-a>//自定义事件接受子组件传递给父组件的信息 v-model:父组件传递数据给子组件
exports default({
data:function(){
return{
childWords:''
}
},
method:{
listenToMyboy:function(msg){
//通过绑定的参数msg
this.childWords =msg;
}
},
component:{componentA}//注册子组件，否则不能使用
});
