随笔分类 - vue
摘要：在子组件progress-circle.vue的template中的定义如下： <svg :width="radius" :height="radius" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg> 在
阅读全文
摘要：CommonJS模块开发 CommonJS定义 每个文件就一个模块，有自己的作用域。在一个文件里面定义的变量、函数、类，都是私有的，对其他文件不可见。 私有作用域不会污染全局作用域。 模块可加载多次，只会在第一次加载时运行一次，然后结果会被缓存起来， 以后在使用，就直接读取缓存结果。想要让模块再次运
阅读全文
摘要：默认插槽 目的：组件的插槽使封装后的组件更具扩展性 基本使用：<slot></slot> <body> <div id="app"> <cpn></cpn> <!-- 在vue实例中使用插槽 --> <cpn> <button>按钮</button> </cpn> <cpn> <input type
阅读全文
摘要：##父访问子 方式一：$children（不常用） <body> <div id="app"> <cpn></cpn> <button @click="btnClick">按钮</button> </div> <template id="cpn"> <div> <h2>我是子组件</h2> </di
阅读全文
摘要：v-bind基础使用 动态地绑定一个或多个 属性，或者绑定一个组件 prop 到表达式。 语法：v-bind:属性名 = 属性值 <!-- 绑定一个 attribute --> <img v-bind:src="imageSrc"> v-bind语法糖 缩写：: （真实开发时常用） <!-- 缩写
阅读全文
摘要：组件之间的传值 组件是一个单独功能模块的封装，有属于自己的data和methods，一个组件的 data 选项必须是一个函数 为什么必须是函数：因为只有当data是函数时，不同实例调用同一个组件时才会开辟新空间，互不干扰 data() { return { count: 0 } } 父子组件区分 <
阅读全文
摘要：事件绑定 vue官方文档：<https://cn.vuejs.org/v2/guide/events.html#%E4%BA%8B%E4%BB%B6%E4%BF%AE%E9%A5%B0%E7%AC%A6> 说明： 一般用@替代v-on：实现绑定 事件修饰符 .stop .prevent .captu
阅读全文
摘要：计算属性和侦听器 计算属性 模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。对于任何复杂逻辑，你都应当使用计算属性。 计算属性缓存 vs 方法 计算属性的结果会进行缓存，只要属性的内容不变，就不会重新计算 。相比之下，每当触发重新渲染时，调用
阅读全文
摘要：Vue组件 组件作用： 用来减少代码量,在使用Vue开发过程中,可以根据不同业务功能将页面划分多个不同的组件,然后由多个组件去完成整个页面的布局。同时方便功能的复用，若不同页面中存在相同的功能只需要引入该功能组件。 全局组件 全局组件注册给Vue实例,可以在任意Vue实例的范围内使用该组件，即在任何
阅读全文
摘要：生命周期图示 生命周期方法 生命周期函数与 data(){}和methods:{}同级 1.初始化阶段 beforeCreate() 生命周期中第一个函数,该函数在执行时Vue实例仅仅完成了自身事件的绑定和生命周期函数的初始化工作,Vue实例中还没有 Data el methods相关属性 crea
阅读全文
浙公网安备 33010602011771号