Vue.js
文章平均质量分 57
Vue.js
teng28
这个作者很懒,什么都没留下…
展开
-
Vue3中实现改变富文本中图片标签的样式以及点击图片放大功能
Vue3中实现改变富文本中图片标签的样式以及点击图片放大功能富文本(例子)vHtml.value = '<p><img src="https://static.yzou.cn//ue/D1B42C986C644AD9ACFD083BFFFCD093.png" title="" alt=""/></p>'富文本展示<div class="mask-v-html" v-html="vHtml" @click="imageEnlargement">原创 2022-05-11 11:46:46 · 1761 阅读 · 0 评论 -
Vue-router钩子函数的种类
Vue-router钩子函数的种类原创 2022-03-24 15:59:03 · 256 阅读 · 0 评论 -
Vue生命周期和小程序生命周期的区别
Vue生命周期和小程序生命周期的区别原创 2022-03-24 15:58:48 · 701 阅读 · 0 评论 -
ref和$refs的区别
ref和$refs的区别原创 2022-03-24 15:58:27 · 2400 阅读 · 0 评论 -
vue中是怎么实现父向子、子向父、兄弟之间的传值的?
vue中是怎么实现父向子、子向父、兄弟之间的传值的?原创 2022-03-24 15:58:03 · 229 阅读 · 0 评论 -
vue中computed和watch的区别是什么?
vue中computed和watch的区别是什么?原创 2022-03-24 15:57:43 · 272 阅读 · 0 评论 -
组件中的data为什么要定义成一个函数而不是一个对象?
组件中的data为什么要定义成一个函数而不是一个对象?原创 2022-03-24 15:57:11 · 998 阅读 · 0 评论 -
v-for循环为什么一定要绑定key?
v-for循环为什么一定要绑定key?原创 2022-03-24 15:56:52 · 1263 阅读 · 0 评论 -
vuex的用法
vuex的用法原创 2022-03-24 15:56:27 · 102 阅读 · 0 评论 -
vue双向数据绑定的原理
vue双向数据绑定的原理原创 2022-03-24 15:55:21 · 196 阅读 · 0 评论 -
mvvm与mvc模型
mvvm与mvc模型原创 2022-03-24 15:54:32 · 287 阅读 · 0 评论 -
vue.js中ref和$refs的区别
es6有哪些新特性变量的改变模版字符串(``)箭头函数循环字符串新增api变量的改变用来声明变量(块级作用域)const 用来表示常量(块级作用域)模版字符串(``)字符串拼接。将表达式嵌入字符串中进行拼接。用${}来界定。console.log(hello ${name}) //hello lux在ES5时我们通过反斜杠()来做多行字符串或者字符串一行行拼接。es6直接使用``箭头函数不需要function关键字可以省略return关键字继承当前上下文的this关键原创 2021-11-26 16:52:41 · 1328 阅读 · 0 评论 -
Vue.js框架入门之路由(十)
Vue.js框架入门之路由(十)什么是路由在 vue 中使用 vue-router什么是路由**后端路由:**对于普通的网站,所有的超链接都是URL地址,所有的URL地址都对应服务器上对应的资源;**前端路由:**对于单页面应用程序来说,主要通过URL中的hash(#号)来实现不同页面之间的切换,同时,hash有一个特点:HTTP请求中不会包含hash相关的内容;所以,单页面程序中的页面跳转主要用hash实现;在单页面应用程序中,这种通过hash改变来切换页面的方式,称作前端路由(区别于原创 2020-06-02 11:35:20 · 381 阅读 · 0 评论 -
Vue.js框架入门之组件(下)(九)
Vue.js框架入门之组件(下)(九)组件中的传值父组件向子组件传值父组件把方法传递给子组件子组件向父组件传值使用 `this.$refs` 来获取元素和组件组件中的传值父组件向子组件传值组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据<script> // 创建 Vue 实例,得到 ViewModel var vm = new Vue({ el: '#app', data: { msg: '这是父组件原创 2020-06-01 20:58:35 · 299 阅读 · 0 评论 -
Vue.js框架入门之组件(上)(八)
Vue.js框架入门之组件(上)(八)定义Vue组件全局组件定义的三种方式1.使用 Vue.extend 配合 Vue.component 方法:2.直接使用 Vue.component 方法:3.将模板字符串,定义到script标签种:私有组件定义组件中的data和methods组件的切换切换方式1(`v-if`和`v-else`)切换方式2(component)切换动画定义Vue组件什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要原创 2020-06-01 18:48:14 · 193 阅读 · 0 评论 -
Vue.js框架入门之动画(七)
Vue.js框架入门之动画(七)动画的介绍使用 transition 元素,把 需要被动画控制的元素,包裹起来当界面需要多处使用动画时,我们可以给动画命名实现多动画的使用使用第三方类实现动画动画的介绍为什么要有动画:动画能够提高用户的体验,帮助用户更好的理解页面中的功能;使用 transition 元素,把 需要被动画控制的元素,包裹起来<style> /* v-enter 【这是一个时间点】 是进入之前,元素的起始状态,此时还没有开始进入 */ /* v-le原创 2020-06-01 17:11:57 · 532 阅读 · 0 评论 -
Vue.js框架入门之自定义指令(六)
Vue.js框架入门之自定义指令(六)自定义全局指令自定义私有指令自定义指令的使用方式自定义全局指令// 自定义全局指令 v-focus,为绑定的元素自动获取焦点: Vue.directive('focus', { inserted: function (el) { // inserted 表示被绑定元素插入父节点时调用 el.focus(); } });自定义私有指令directives: { Vue.directive('foc原创 2020-06-01 11:49:58 · 197 阅读 · 0 评论 -
Vue.js框架入门之生命周期(五)
Vue.js框架入门之生命周期与自定义指令(五)生命周期生命周期首先,我们先来看一下Vue中的生命周期图,通过这个图,我们可以看到Vue中的各种内置函数的执行顺序与执行时间,通过了解这些相关知识,对于后续我们对Vue.js的学习能有更深层次的理解。代码实例<div id="app"> <input type="button" value="修改msg" @click="msg='No'"> <h3 id="h3">{{ msg }}</h3原创 2020-06-01 11:30:45 · 229 阅读 · 0 评论 -
Vue.js框架入门之过滤器(四)
Vue.js框架入门之过滤器(四)全局过滤器不带参数的全局过滤器带参数的全局过滤器私有过滤器总结过滤器概念:Vue.js 允许你自定义过滤器,可被用作一些常见的文本格式化。过滤器可以用在两个地方:mustache 插值和 v-bind 表达式。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符"|"指示;全局过滤器不带参数的全局过滤器msgFormat是过滤器的名称<div id="app"> <p>{{ msg | msgFormat}}<原创 2020-06-01 10:41:34 · 328 阅读 · 0 评论 -
Vue.js框架入门之指令(三)
Vue.js框架入门之指令(三)使用class样式使用内联样式(style 属性绑定的数据即为内联样式)v-for条件渲染1.v-if/v-else2.v-show3.v-if 与v-show的区别使用class样式数组<h1 :class="['red', 'thin']">这是一个邪恶的H1</h1>数组中使用三元表达式<h1 :class="['red', 'thin', isactive?'active':'']">这是一个邪恶的H1</原创 2020-05-31 19:48:50 · 368 阅读 · 0 评论 -
Vue.js框架入门之指令(二)
Vue.js框架入门之指令(二)插值表达式文本HTMLJavaScript表达式指令v-cloakv-textv-htmlv-bindv-bind的三种用法v-on事件修饰符v-modelVue.js为了让我们脱离对DOM的操作,Vue.js给我们封装了许多指令让我们可以进行相关操作。Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。结合响应系统,在应用状态改变时, Vue原创 2020-05-31 14:21:02 · 467 阅读 · 0 评论 -
Vue.js框架入门之vue简介及其基本语法(一)
Vue.js学了有一段时间了,最近也在准备面试,然后整理一下Vue.js相关的知识,温故而知新。目录一、什么是Vue.js?Vue.js 是目前最火的一个前端框架,React是最流行的一个前端框架(React除了开发网站,还可以开发手机App, Vue语法也是可以用于进行手机App开发的,需要借助于Weex)Vue.js 是前端的主流框架之一,和Angular.js、React.js 一起,并成为前端三大主流框架!Vue.js 是一套构建用户界面的框架,只关注视图层,它不仅易于上手,还原创 2020-05-31 09:50:36 · 1092 阅读 · 0 评论 -
vue混入的使用与解析
vue混入的使用与解析简介钩子函数合并数据对象合并普通方法合并局部混入全局混入1. 在 HTML 中全局混入2. 在 Vue 项目中全局混入简介 混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。钩子函数合并 同名钩子函数将混合为一个数组,因此都将被调用。另外,混入对象的钩原创 2021-06-30 15:51:05 · 802 阅读 · 0 评论 -
Vue.js框架之this.$set的用法
Vue.js框架之this.$set的用法从三个方面给大家说一下这个this.$set:1.this.$set实现什么功能,为什么要用它?2.怎么用它?3.应用场景从三个方面给大家说一下这个this.$set:1.this.$set实现什么功能,为什么要用它?当你发现你给对象加了一个属性,在控制台能打印出来,但是却没有更新到视图上时,也许这个时候就需要用到this.set()这个方法了,简单来说this.set()这个方法了,简单来说this.set()这个方法了,简单来说this.set的功能就是解原创 2020-08-17 09:46:20 · 3094 阅读 · 0 评论 -
vue中$forceUpdate的使用
vue中的forceUpdate的使用简介强制刷新的方式方法一方法二简介在Vue官方文档中指出,$forceUpdate具有强制刷新的作用。但是这个针对于深层次结构数据,数据通过赋值进行了更新,但是vue监听不到。强制刷新的方式对于普通类型的数据来说,我们不需要操心数据绑定,Vue的内部机制已经帮助我们监听更新,但是对于一个复杂对象来说,例如数组对象、对象数组等,我们对其某个元素增加属性,vue就监听不到了。对照着vue文档规范,我们应该使用 $set来进行数据的操作或者初始化,这样的话v原创 2021-06-30 16:22:50 · 1304 阅读 · 1 评论 -
this.$nextTick的用法
this.$nextTick的用法官方解释第一个例子第二个例子总结官方解释将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样,不同的是回调的 this 自动绑定到调用它的实例上。这样看上去是不是挺懵的,自己在网上看了几篇博客后, 才真正对this.$nextTick的用法及使用场景有了一定的理解。不管怎么说, 与其看一些晦涩难懂的文字概念, 还不如自己实操整几个demo来体会一下。第一个例子<原创 2021-09-01 17:17:47 · 650 阅读 · 1 评论 -
vue.js中DES、RSA、SHA1、MD5这四种加密算法的使用
VUE中DES、RSA、SHA1、MD5这四种加密算法的使用DESRSASHA1MD5DES美国 数据加密标准(DES)是对称密码算法,就是加密密钥能够从解密密钥中推算出来,反过来也成立。密钥较短,加密处理简单,加解密速度快,适用于加密大量数据的场合。前端有时把数据传给后端,也是需要加密的,这里介绍下des加密:DES 加密算法为最为常见的分组加密算法。其主要思想在于数据位的置换与移位过程,通过16次的迭代加密与最终的逆置换得出最终的密文。DES 的解密方式只需按照加密的逆过程求解即可。由于原创 2021-09-07 14:15:52 · 1838 阅读 · 0 评论