Vue
文章平均质量分 87
好好学习,天天向上
张可盐
张得可盐,还得嗑盐
展开
-
Vue指令的使用
入门目录1.`v-once`2.`v-text`3.`v-html`4.`v-show 、v-if`5.`v-else、v-else-if`6.`v-for`7.`v-on`8.`v-bind`9.`v-model`最后`v-block` CND的引用 <!-- 开发环境版本,包含了有帮助的命令行警告 --> <script src="https://cdn.jsdelivr.n...原创 2020-03-05 12:18:11 · 714 阅读 · 0 评论 -
Vue自定义指令
前言 第一章——v指令的使用 在上一篇文章中介绍到在Vue中一些指令的使用,按照官方的说法在 Vue2.0 中,代码复用和抽象的主要形式是组件,然而,有的情况下,仍然需要对普通 DOM 元素进行底层操作,这个时候就需要用到自定义指令。 ...原创 2021-01-15 13:35:01 · 97 阅读 · 0 评论 -
Vue的计算属性
在介绍完前面的指令后,接下来是对一些计算对象的介绍。当然之前已经提及了在Vue()中的methods对象,这是一个方法对象,虽然它已经能够处理大部分的逻辑,但Vue另外提供了一些计算方法供我们选择原创 2021-01-15 17:26:21 · 164 阅读 · 0 评论 -
Vue的侦听属性
前面提到了计算属性,虽然计算属性在大多数情况下更合适,但有时也需要一个自定义的侦听器。这就是为什么 Vue 通过 watch 选项提供了一个更通用的方法,来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。原创 2021-01-15 20:44:55 · 213 阅读 · 0 评论 -
Vue的过滤器
前面介绍到了计算属性和侦听属性,除此之外Vue还专门提供了过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符号|指示。原创 2021-01-16 13:00:44 · 119 阅读 · 0 评论 -
Vue的methods、computed、watch、filter对比分析
本文主要是对之前提到过的methods,computed,watch进行区别对比,相应的实例已经在之前的文章提及,如果有忘记的可以回顾康康呀!原创 2021-01-16 13:35:10 · 515 阅读 · 0 评论 -
Vue的组件注册
第三章着重介绍组件(component )的使用。和指令,过滤器一样,组件可以分为局部组件和全局组件,定义方式也都大同小异。在真正介绍component之前,先介绍 Vue.extend({Object} options) 。Vue.extend()使用基础 Vue 构造器………………………………………………………………………………………………………………………………原创 2021-01-17 22:58:54 · 226 阅读 · 0 评论 -
Vue的父子组件通信
前言 组件注册 在上个文章中介绍了组件的注册,包括局部注册和全局注册。这里将介绍父子组件以及父子组件之间的通信方式。 父子组件 父子组件,顾名思义就是在组件中套用组件形成父子关系,一个简单的实例如下: <body> <div id="app"> <father> </father> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></原创 2021-01-18 21:34:24 · 111 阅读 · 0 评论 -
Vue插槽的使用
这里主要介绍插槽。什么是插槽?在定义组件之后我想在html中另外新加入几个内容,这种情况肯定不可能再重新从组件模板中添加。插槽可以解决这个问题。 基础实例 <div id="app"> <father title="这里是标签"> 插槽的使用 </father> </div.原创 2021-01-19 21:26:04 · 128 阅读 · 0 评论 -
Vue共享数据模式 VueX
前言 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 举一个简单的例子,都知道父子组件通信,那么兄弟组件通信怎么办那?可能有人想到先把子组件的数据传递到父组件中,然后兄弟组件接收父组件中的数据。诚然这样的方式确实可以实现我们的需求,可要是嵌套的过多的话,那么麻烦吗?答案是肯定的! 简单来说,VueX 可以帮助我们共享数据,和组件一样,实现复用。 Vuex 使用单一状态树,用一个对象就包含了全原创 2021-01-22 13:13:54 · 161 阅读 · 0 评论 -
Vue路由 VueRouter
安装 直接下载 / CDN https://unpkg.com/vue-router/dist/vue-router.js Unpkg.com 提供了基于 NPM 的 CDN 链接。上面的链接会一直指向在 NPM 发布的最新版本。你也可以像 https://unpkg.com/vue-router@2.0.0/dist/vue-router.js 这样指定 版本号 或者 Tag。 NPM npm install vue-router 如果在一个模块化工程中使用它,必须要通过 Vue.use() 明确地原创 2021-01-22 16:32:01 · 131 阅读 · 0 评论 -
Vue的生命周期
Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周期。 在Vue的整个生命周期中,它提供了一系列的事件,可以让我们在事件触发时注册js方法,可以让我们用自己注册的js方法控制整个大局,在这些事件响应方法中的this直接指向的是vue的实例。 特别值得注意的是created钩子函数和mounted钩子函数的区别 每个钩子函数都在啥时间触发 beforeCre.转载 2021-01-22 16:44:07 · 113 阅读 · 0 评论