-
export default {components: {hello}} export后面跟的对象,会作为 new Vue()的参数,来创建一个Vue的组件,并导出;查看全部
-
双向绑定 v-model查看全部
-
data是数据,methods是事件函数,watch是监控函数查看全部
-
Vue查看全部
-
脚手架开发环境查看全部
-
<template> <div id="app"> <img src="./assets/logo.png"> <router-view></router-view> <h1>{{haha}}</h1> <ul> <li v-for="item in items" v-bind:class="[item.isred?classred:'']"> {{item.label}} </li> </ul> </div> </template> <script> export default { name: 'app', data (){ return{ haha:'hehe', items:[ { label:'转行学前端', isred:false }, { label:'找不到工作', isred:true }, ], classred:'red' } } } </script> <style> #app { font-family: 'Avenir', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; } li{ list-style:none; } .red{ color:red; } </style> 这里{ red: item.isred }和[item.isred?classred:'']一样不过这降低了耦合度吧?查看全部
-
在组件中用props注册msg后,组件就可以获取从对应标签中传的msg查看全部
-
引用组件需要在components里面注册,才能用对应标签渲染组件中的内容查看全部
-
data代表vue对象的数据,methods代表vue对象的方法,watch设置了对象监听的方法查看全部
-
因为有些事件是自定义事件,寻常方法执行不了,所以需要$emit()触发查看全部
-
‘父亲’传‘儿子’:父亲注册(components)后,儿子用‘props ’提取;查看全部
-
vue里面组件的划分: 1、功能模块: 如 select pagenation ... 2、页面区域: 如 header footer sidebar ... Vue组件的实现---components 1、app.vue里面引入组件 2、通过components 来注册组件 如: import Header form './header' import Footer form './footer' new Vue({ data:{ isShow:true }, components:[ Header,Footer ] }) Vuejs组件之间的通信---props 1、先注册 2、props 是属性的意思 如: //this is header.vue new Vue({ data:{username:'xx'}, props:['msg'], //获得app.vue里面header的属性msg传过来的值 methods:{ doThis:function(){ //通过dothis 方法里面获得this.msg console.log(this.msg) } } }) //this is header.vue <header msg='something interesting'></header> //msg属性可以传递任何值到app.vue <footer></footer>查看全部
-
vue项目环境搭建: 1.全局安装vue-cli $npm install -g vue-cli 2.创建一个基于webpack模版的新项目 $vue init webpack my-project 3.安装依赖 $cd my-project $npm install 4.运行项目(在项目目录下) $npm run dev查看全部
-
$boardcast查看全部
-
this.$emit this.$dispatch debuger查看全部
举报
0/150
提交
取消