vue
野生技术协会
杂乱个人资料记录
展开
-
vue基础扩展9-属性监测变更原理
// vue属性监测变更原理 // 概述: 在使用vue中我们在data中定义的属性,能够在改变后,页面能够监听这些变化,下面演示属性监测变更的一些原理。 // 1、定义一个对象,用get、set改写属性, 即在get和set可以定义扩展的功能,而vue属性监测变更主要是通过同一个Dep对象 // 实现get,set的变更监听。即get时(如页面使用属性时),包装使用这些者属性为一个(Watch对象),添加到Dep中,而set时 //,调用这些所有, 添加的监听。 var obj.原创 2021-01-15 23:12:04 · 263 阅读 · 3 评论 -
vue基础扩展8--solt详解
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展8--solt详解</title></head><body> <!--- 一、旧的插槽 概述:插槽是什么? 顾明思意就是,在组件内定义了一个占位符,可以用来拿到组件包裹的内容进行渲染。 或者说我们在使用组件时,在组件内.原创 2021-01-15 23:11:15 · 1583 阅读 · 4 评论 -
vue基础扩展7--provide和reject
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展7--provide和reject</title></head><body> <script> // 1、基本使用范例 var Provider = { data() { return { ..原创 2021-01-15 23:10:06 · 762 阅读 · 3 评论 -
vue基础扩展6--v-model原理
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展6--v-model原理</title></head><body> <div id="app"> <h2>测试v-model的替代</h2> <input :value="text" @input..原创 2021-01-15 23:09:26 · 218 阅读 · 3 评论 -
vue基础扩展5--重置表单成默认值
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展5--重置表单成默认值</title></head><body> <!--- 概述:vue 的data数据,会在vue创建后,绑定到options属性下,因此还原表单默认值可以使用 this.query = this.$opt.原创 2021-01-15 23:08:51 · 1571 阅读 · 3 评论 -
vue基础扩展4---$parent属性
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展4---$parent属性</title></head><body> <div id="app"> {{msg}} <my-child ></my-child> </div> <s.原创 2021-01-15 23:08:21 · 558 阅读 · 3 评论 -
vue基础扩展3---$on和$emit的使用
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展3---$on和$emit的使用</title></head><body> <!-- // 监听自定义事件 vm.$on('eventName',msg=>{ }); // 触发自定义事件 vm.$emit('eventName..原创 2021-01-15 23:07:38 · 2206 阅读 · 3 评论 -
vue基础扩展2---$refs的使用
<scriptsrc="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><title>vue基础扩展2---$refs的使用</title></head><body><divid="app"><com-aref="comA">组件</com-a><divref="ref_do...原创 2021-01-15 23:07:06 · 272 阅读 · 3 评论 -
vue基础扩展1---响应式属性监测
<title>vue基础扩展1---响应式属性监测</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <style> .wrap { margin-bottom: 20px;min-height: 100px; border: 1px solid #333;} </style></head><.原创 2021-01-15 23:06:15 · 199 阅读 · 3 评论