声明式渲染

Vue 开发入门

https://cn.vuejs.org/v2/guide/

https://cn.vuejs.org/v2/api/

Vue 开发入门

<div id="app"> <p :style="`color:${colorStr}`" v-show="showErr"> {{errMsg}}</p> <input v-model="keywords"/> <ul v-if="data.length"> <li v-for="item of data">{{item.name}}</li> </ul> <p v-else>没有数据</p> </div>

Vue.component('my-component', { // 模板 template: `...`, // 子组件 components: {}, // 属性 props: [], data: function() { return {}; }, computed: {}, watch: {}, // 生命周期钩子 beforeCreate() {}, created() {}, mounted() {}, updated() {}, beforeDestory() {} ... // 方法 methods: {} })

Vue 开发进阶

Vue CLI

https://cli.vuejs.org/
安装

npminstall -g @vue/cli# ORyarnglobaladd @vue/cli

创建项目

vuecreatemy-project#ORvue ui

工具函数：

第三方工具函数：lodash