![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
章柏华
这个作者很懒,什么都没留下…
展开
-
class用法
------------------------------------第一种用法---------------------------------------.red{ color:red;}.b{background:black}strong :class="[red,blue]">文字....strong> //[red,blue] 是数据data:{原创 2017-02-19 20:46:33 · 531 阅读 · 0 评论 -
1.1 指令 vue shop
1、引入组件方式 import abc from './components/a'export default { components:{abc}}2、引入组件方式 import abc from './components/a'export default { components:{abc}, data(原创 2017-07-24 11:47:23 · 255 阅读 · 0 评论 -
1.1 组件注册 vue shop
//最后替换成 ni haonew Vue({ el:"app", template:'ni{{hao}}', data:{ hao:'hao' }})一、组件注册 Vue.component('my-header',{ template:'this is my header'});原创 2017-07-21 16:13:20 · 253 阅读 · 0 评论 -
vue-router 路由
bower info vue-router //查看版本bower install vue-router#0.7.13原创 2017-02-22 22:59:44 · 209 阅读 · 0 评论 -
1-2交互 vue-resouce
vue交互方式getget交互如下所示:两个方法,一个成功,一个失败。methods:{ get: function () { this.$http.get('1-1.html').then(function (res) { res是一个对象,里面包含状态码,包含数据 console.log(res.data); }原创 2017-02-04 17:48:23 · 308 阅读 · 0 评论 -
1-3事件深入
1.阻止冒泡:e.cancelBubble=truediv class="box"> div @click="show2()"> input type="button" value="按钮" @click="show($event)"> //另一种方式 使用.stop input type="button" value="按钮" @click.stop="原创 2017-02-14 21:12:23 · 174 阅读 · 0 评论 -
vue 定义组件
--------------------------------------全局组件--------------------------------------------------------定义组件的第一种方式 //aaa就是组件var Aaa=Vue.extend({template:'我是标题' });var bbb=Vue.c原创 2017-02-21 23:15:07 · 3433 阅读 · 0 评论 -
vue动画
style.fade-transition{transition: 1s all ease;} // transition="fade" css后面要添加 transitio.fade-enter{opacity: 0;} //进入时动画.fade-leave{opacity: 0; transform: transl原创 2017-02-21 22:12:21 · 632 阅读 · 0 评论 -
bower使用
bower相当于npm,前端管理器首先要安装node安装bower npm install bower -g验证 检查版本 bower --version使用bower下载安装其他包bower install 安装bower uninstall 卸载包bower info 查看包的所有版本bower install vue#1.0.28原创 2017-02-21 22:05:46 · 266 阅读 · 0 评论 -
自定义指令
span v-red>aaaaaaaaspan>Vue.directive('red', function () { //red是自定义指令名称 不要v- this.el.style.background='red' //this是Vue实例 });原创 2017-02-20 23:41:39 · 176 阅读 · 0 评论 -
过滤器
--------------------------------------debounce 延迟2000-----------------------------input type="text" @keyup="show | debounce 2000">---------------------------------limitBy 取几条数据------------原创 2017-02-20 22:42:07 · 143 阅读 · 0 评论 -
vm
vm.$mount('#box'手动挂载,相当于el:"#box"new Vue({}).$mount('#box')-----------------------------------------------------------------------------------------var vm = new Vue({ aa:11, //自定义属原创 2017-02-20 22:17:44 · 185 阅读 · 0 评论 -
computed 属性计算
window.onload= function () { var vm = new Vue({ el:"#box", data:{ a:1 }, computed:{ b:{ //b只是一个属性,不是方法 get: function () {原创 2017-02-20 22:10:05 · 259 阅读 · 0 评论 -
vue钩子函数
var vm = new Vue({ el:"#box", data:{ msg:'well' }, methods:{ }, created: function () { console.log('实例已经创建'); }, beforeCompile: function () {原创 2017-02-20 21:16:31 · 1413 阅读 · 0 评论 -
1-1指令
指令:扩展html标签功能,属性v-model 一般表单元素(input)双向绑定v-repeat 循环(弃用)现在用v-for循环 v-for='name in arr' li v-for="value in arr">{{value}}{{$index}}li> 其中{{$index}}是自带-----------------------------------原创 2017-02-04 14:18:52 · 288 阅读 · 0 评论 -
1.3组件之间传值
1.父组件传递数据给子组件父组件数据如何传递给子组件呢?可以通过props属性来实现父组件:parent> child :child-msg="msg">/child>//这里必须要用 - 代替驼峰/parent>data(){ return { msg: [1,2,3] };}123456789123456789子组件通转载 2017-07-24 11:56:32 · 378 阅读 · 0 评论