前端界面使用篇
vue生命周期初始化事件
http://www.cnblogs.com/lily1010/p/5830946.html
常见错误篇
1 Newline required at end of file but not found
提示少一个文件结尾 在文件最后面敲一个“回车”即可解决。
网上错误集锦 来源转发 发帖人未查找到
http://www.tuicool.com/articles/7nYnIba
vue中提供的变异方法 仅仅是给出列方法名称使用方法和用处没有讲解，不过可以参照html的array数组操作方式
基本方法操作效果一致
push() pop() shift() unshift() splice() sort() reverse()
参照 http://www.w3school.com.cn/jsref/jsref_obj_array.asp
splice()可用于修改例如array.splice(0,1,newitem) 从什么位置，删除几个元素，最后一个是新的元素用于顶替刚删除的元素用于
实现更新效果
技巧方法篇
1.初始化表单数据
方法1:封装在方法中 使用时调用即可
function init () {
for(var name in this.$data.form) {
this.$data.form[name] = ""
}
this.name = ''
}方法2:
new Vue({
el: '#app',
data() {
return {
value1: "",
value2: "我是預設值",
value3: "",
value4: "我也是",
value5: "",
form: {}
}
},
created() {
this.defaultData = JSON.parse(JSON.stringify(this.$data));
},
methods: {
submit() {
// 送出後
this.$data = Object.assign(this.$data, this.defaultData);
}
}
})
局部初始化是 不需要$符号 直接使用数据字段就好例如 this.form注意点篇
计算属性 computed
用于将属性进行复杂化逻辑处理的时候 从Mustache语法中独立处理，Mustache尽量用来数据展示不做
逻辑处理例如：
<p>Reversed message: "{{message.split('').reverse().join('') }}"</p>
改为
computed: {
// a computed getter
reversedMessage: function () {
// `this` points to the vm instance
return this.message.split('').reverse().join('')
}
}
调用时
{{reversedMessage}}
方法 method 与computed基本相同
methods: {
// a computed getter
reversedMessage: function () {
// `this` points to the vm instance
return this.message.split('').reverse().join('')
}
}
调用时
{{reversedMessage()}}
以上个属性都能达到所需的效果，唯一区别是
computed当属性不产生变化时不会变更，每次都是读取缓存当中的值
而method每次使用时都会运行一次，时时刷新。
watches 观察属性
此属性与computed效果类似 常用语属性发生变更时
同时对属性进行大量逻辑或执行异步及延迟处理时使用
当指定监控的属性发生变化时则会出发观察属性进行数据处理。
var watchExampleVM = new Vue({
el: '#watch-example',
data: {
question: '',
answer: 'I cannot give you an answer until you ask a question!'
},
watch: {
// 如果 question 发生改变，这个函数就会运行
question: function (newQuestion) {
this.answer = 'Waiting for you to stop typing...'
this.getAnswer()
}
}
}）
常用方法集锦
vue数据操作
http://www.cnblogs.com/lily1010/p/5830946.html
安装篇
vue安装配置 非原创 引用于“得金”
$ npm install -g vue-cli
$ vue init webpack my-project $ cd my-project
$ npm install
$ npm run dev
vue 基础 http://cn.vuejs.org/v2/guide/installation.html
vue 状态管理 http://vuex.vuejs.org/en/ 源码https://github.com/vuejs/vuex
vux 中文路径 https://vuxjs.gitbooks.io/vux/content/
vue 路由 http://router.vuejs.org/zh-cn/
vue 网路请求 https://github.com/mzabriskie/axios
editorconfig 配置你的编辑器 http://www.cnblogs.com/xiyangbaixue/p/4201490.html
例子
网站插件使用 https://wappalyzer.com/download
项目结构介绍 http://hyuhan.com/2016/12/20/vue-cli-2-0/
easy-vue http://tigerb.github.io/easy-vue/#/
echarts 数据化可是平台展示 https://github.com/hieeyh/tong2-family
笔记应用 https://segmentfault.com/a/1190000005015164
1 data //vue 对象数据
2 methods //vue 对象方法
3 watch // vue对象监听方法
4 computed // 计算机逻辑放到 computed
5 created // 属性已绑定 dom未生成 一般在这里进行ajax 处理以及页面初始化处理