- 博客(13)
- 收藏
- 关注
原创 vue之prpos
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compa...
2019-09-18 09:55:09 374
原创 组件注册
<div id='app'><my-component-name> </my-component-name></div><script>Vue.component("myComponentName",{template:"<div>This is my-component-name</div>"})...
2019-09-18 09:53:51 114
原创 Vue的可复用性和组合——自定义指令
首先先回顾一下自定义指令(自动获取焦点)<divid='app'><inputtype="text"v-focus></div><script>Vue.directive('focus',{inserted:function(el){...
2019-09-18 09:50:37 133
原创 Vue的可复用性和组合——mixins混入
混入:(钩子:mixins)</div><script> var myMixin = { created:function(){ this.hello() }, methods:{ hello:function(){ console....
2019-09-18 09:45:13 165
原创 Vue的状态过渡
根据TweenLite属性进行的动画过渡的操作颜色的过渡变化: <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><style> .color-preview{ display:inli...
2019-09-17 10:21:22 348
原创 Vue的动画过渡
.fade-enter-active,.fade-leave-active{transition:opacity 0.5s;}.fade-enter,.fade-leave-to{opacity: 0;}hello}})transition标签中会对其中的元素进行处理上述的例子style中的事件会对其中进行过渡动画过渡的类名包括:v-enter;v-enter...
2019-09-17 10:20:47 86
原创 Vue的处理边界-监听_循环引用和模板
{{ counter }}var app = new Vue({el:"#app",data:{counter:0},mounted:function(){// this.KaTeX parse error: Expected 'EOF', got '}' at position 68: …,value);// })}̲,methods:{add…emit(“added”,...
2019-09-17 10:20:12 131
原创 Vue的父子元素和依赖注入
var app = new Vue({el:"#app",data:{foo:1},computed:{bar:function(){return “bar”}},methods:{baz:function(){return “baz”},onClickMe:function(){console.log(this.$refs);let mybtn=this.myb...
2019-09-17 10:19:39 182
原创 Vue之动态组件和异步组件
currentTabComponent{{currentTabComponent}}Vue.component(‘Tab02’,{template:`This is Tabo2`})var app = new Vue({el:"#app",data:{currentTabComponent:“Tab01”},methods:{changeTab:function(Tab...
2019-09-17 10:19:05 178
原创 Vue之插槽
Vue.component(‘navigation-link’,{props:[“url”],template:<a v-bind:href="url"> <slot></slot> </a>})var app = new Vue({el:"#app"})slot插槽的基本用法,如果没有写插槽的话,传入他的内容都会被抛弃调,...
2019-09-17 10:18:19 141
原创 Vue之自定义事件
组件<base-input @focus.native=“onFocus”>Vue.component(‘base-checkbox’,{model:{prop:“checked”,event:“change”},props:{checked:Boolean},template:`<inputtype=“checkbox”v-bi...
2019-08-28 09:45:11 118
原创 VUE组件
基础组件实例:var app = new Vue({el:"#app",data:{}})注意:由于组件是可复用性的,名字相当于是自己自定义的标签,它也有着data、computed、watch、methods以及生命周期钩子(除el外)在组件中,data必须是函数可以通过prop向子组件传递数据var app = new Vue({el:"#app",da...
2019-08-20 11:30:24 91
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人