![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue.js基础
二狗doggy
这个作者很懒,什么都没留下…
展开
-
methods,watch,computed比较
1.methods,表示具体的操作,主要书写业务逻辑: <form class="form-horizontal"> <div class="form-group"> <label class="col-xs-2 control-label col-xs-offset-1" for="msg"&g...原创 2019-10-26 21:41:20 · 107 阅读 · 0 评论 -
基本路由
<div id='app'> <router-link to='/login'>login</router-link> //router-link用来导航 <router-link to='/regist'>regist</router-link> <router-view></router-view&...原创 2019-10-25 16:44:31 · 144 阅读 · 0 评论 -
实例中组件调用该实例的属性和方法
<div id='app'> <component :is="'comp'" :dataname='msg' @funcname='fun'></component></div>var vm = new Vue({ el: '#app', data: { msg: 'message' }, me...原创 2019-10-24 17:02:29 · 421 阅读 · 0 评论 -
组件
全局组件:Vue.component('myComponent', { template: "<h3>It's a component.</h3>", ...});局部组件:var comp = { template: "<p>a component</p>", ...}var vm = new Vue(...原创 2019-10-24 14:29:10 · 81 阅读 · 0 评论 -
自定义指令
Vue中有内置指令v-model等还可自定义指令全局指令:Vue.directive('focus', { bind: function(){}, //指令绑定时执行 inserted: function (el) { //元素插入DOM中时执行 el.focus(); }, updated: function(){} //更新时执行});//钩...原创 2019-10-23 18:26:55 · 146 阅读 · 0 评论 -
过滤器
过滤器用于文本格式化过滤器可以用在两个地方:双花括号插值 和 v-bind 表达式<!-- 在双花括号中 -->{{ message | capitalize }}<!-- 在 `v-bind` 中 --><div v-bind:id="rawId | formatId"></div>全局过滤器,所有Vue实例对象都可使用:Vue....原创 2019-10-23 10:52:06 · 92 阅读 · 0 评论 -
设置样式
使用外部样式:<!--1.直接传递数组--><p :class="['setColor','setSize']">よろしくお願いします</p><!--2.数组中使用三元表达式--><p :class="['setColor',set?'setSize':'']">よろしくお願いします</p>...原创 2019-10-16 19:32:56 · 116 阅读 · 0 评论 -
事件修饰符
事件修饰符:/**事件修饰符: * .stop 阻止冒泡,只阻止祖先元素的冒泡,子元素不阻止 * .prevent 阻止默认行为 * .capture 触发捕获事件机制(事件顺序与冒泡相反) * .self 只有当点击当前元素,才触发事件处理函数,只阻止自身的冒泡,不真正阻止冒泡 * .once 只触发一次事件处理函数 */使用示...原创 2019-10-16 18:02:19 · 122 阅读 · 0 评论 -
Vue.js入门
简单的Vue使用:<!DOCTYPE html><html><head> <meta charset="UTF-8" /> <title>Vue.js</title> <link href="./style.css" rel="stylesheet" /> <scrip...原创 2019-10-14 22:39:00 · 96 阅读 · 0 评论