
Vue
LiLi_code
热爱技术的互联网女孩~
展开
-
注释Vue中所有的console.log
【一键注释】在前端开发的过程中一般会打印很多的日志但是要发布到线上的时候不希望客户看到其他的信息,但是一个一个的注释太麻烦也不利于以后进行更新下面是个很简单的方法一行代码解决在main.js中加入以下一行代码,全局生效console.log = function() {}如果要进行修改代码进行打印日志查看的时候就把这行代码注释就OK~...原创 2021-08-17 09:58:00 · 883 阅读 · 1 评论 -
Vue2.0 $set()
最近工作中遇到了这种我额外往对象中添加了属性的情况,导致页面效果一直无法实现。困惑中突然明白了原因,做一下整理总结。vue2.0 给data对象新增属性,并触发视图更新如下代码,给 student对象新增 age 属性data () { return { student: { name: '', sex: '' } }}直接给student赋值操作,虽然可以新增属性,但是不会触发视图更新.原创 2021-07-29 21:53:23 · 304 阅读 · 0 评论 -
Vue中DOM异步更新的解决方案——$nextTick
html:<body><div id="app"> <audio ref="audio" :src="url" controls></audio> <span>第 {{index}} 首歌</span> <button @click="changeUrl">切歌</button></div></body>js:<script src="h原创 2021-06-28 18:23:10 · 1172 阅读 · 0 评论 -
Vue3.0使用Element-UI
按照2.x的方式引入import Element from 'element-ui'createApp(App).use(Element).mount('#app')页面会报错:Cannot read property '$isServer' of undefined方法:使用element3官网:https://element3-ui.com/#/npm i element3 -S...原创 2021-05-13 19:41:00 · 819 阅读 · 0 评论 -
HTML、JavaScript 、Vue之【数独解密】(续上一篇)
一、页面展示(1)页面中的空格为input,方便输入数据,数据通过使用Vue实现双向动态绑定(2)任意填入数据(3)点击【解密】,即解出数独答案(当然我这里是让程序计算出一种结果便结束的二、代码展示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-...原创 2020-03-01 19:45:35 · 435 阅读 · 1 评论 -
Html 引入使用 Element-ui、Vue
因为Element-ui是基于Vue的框架,所以要想正常可以使用Element-ui,必须在其脚本引用之前先引用Vue脚本直接代码演示:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> ...原创 2020-03-01 09:32:26 · 7342 阅读 · 0 评论 -
Echarts 设计饼图扇区被选中时中间显示数据
效果图如下:1、初始状态2、扇区被选中时状态(中间数据跟着修改) 思路:使用echarts饼图自带的label,显示出每一个扇区的具体值 可采用 【formatter: "{b} : {c} 人"】 设计格式并将显示位置改为 position: 'right'其实本身直接将position改为 ‘center’也能将数据显示在中间,但是扇区边缘就不会显示具体数...原创 2019-09-05 11:15:12 · 7363 阅读 · 2 评论 -
Vue前端验证一个text只能输入手机号或邮箱
直接上代码:element-ui 内部 text:<el-form-item prop="username"> <el-input v-model="ruleForm.username" placeholder="用户名" autofocus> </el-input></el-form-item>检查对象:let ...原创 2019-08-01 16:00:21 · 2302 阅读 · 0 评论 -
Vue ☞ 离开界面之后 setInterval 倒计时持续运行问题
写毕设时写到了考试界面,使用了专门的倒计时,但是离开此页面去其他页面时,会依旧运行此计时器,导致到达指定时间时会触发相应操作,影响客户端,解决方法如下:beforeDestroy() { if (this.time) { //如果定时器还在运行 或者直接关闭,不用判断 clearInterval(this.time); //关闭 }},this.t...原创 2019-05-19 15:52:18 · 1691 阅读 · 0 评论 -
Vue 内部指令
1、{{message}} 插值表达式 取出Vue中的data(别忘了引入Vue.js)<script type="text/javascript"> var app = new Vue({ el:'#app', data:{ message:'Hello World!' } })</script>...原创 2019-04-11 22:37:59 · 246 阅读 · 0 评论