![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
大橙子_L
安静又活泼的矛盾体
展开
-
【vue】使用.sync实现数据的双向绑定
【vue】使用.sync 实现数据的双向绑定在 vue 中想要在父子组件中实现数据的双向绑定(子组件能感知父组件的值的修改,父组件能感知子组件的值的修改)有三种方式:v-model()动态绑定数据+显示事件监听().sync三种方式各有千秋,v-model 只能绑定一个对象,动态绑定数据+显示事件监听略显麻烦,.sync 相对方便简单一点。(个人直观感受,详细差异有待挖掘).sync 的使用子组件 mySelect.vue 代码:<template> <el-sel原创 2020-06-01 09:40:38 · 2686 阅读 · 0 评论 -
vue自定义组件中使用v-model
vue 自定义组件中使用 v-modelv-model 简单认识v-model 是 vue 用于数据双向绑定的一个指令。其实它是一个语法糖,本质上包含两个操作:v-bind 绑定一个 value 属性v-on 指令给当前元素绑定 input 事件即<input type="text" v-model="message" />等同于<input type="text" v-bind:value="message" v-on:input="message=$e原创 2020-05-26 18:23:41 · 1847 阅读 · 0 评论 -
简单理解Vue中的nextTick
Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下。其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick。一、示例先来一个示例了解下关于Vue中的DOM更新以及nextTick的作用。模板<div class="app"> <div ref="msgDiv">{{msg}...转载 2020-01-13 10:38:58 · 114 阅读 · 0 评论 -
【vue】监听页面刷新和关闭事件
vue监听页面刷新和关闭事件需求背景在离开页面的时候,需要弹出提示框,让用户确定是否真的要关闭网页。如果用户真的需要关闭网页,则让浏览器向后台提交信息。原始实现在beforeDestory钩子函数中,调用提交操作。beforeDestroy () { this.updateRecord() },经实验验证,该方法无法达到目的。发现beforeDestroy 只能监听到...原创 2019-12-11 19:56:03 · 18280 阅读 · 1 评论 -
刷新或关闭浏览器时,向后台提交数据
...转载 2019-12-11 19:47:52 · 1708 阅读 · 0 评论 -
XMLHttpRequest 详解
...转载 2019-12-11 19:14:09 · 348 阅读 · 0 评论 -
在vue中,如何禁止回退上一步,路由不存历史记录
在有些情况下,我们不想往路由里添加历史记录。(vue的项目,vue-router中不想存历史记录)根据vue官网提供的,楼主总结了一下,主要有以下几种方案:根据官网的解释 。声明式路由和编程式路由都是添加新的记录,同时vue还提供了replace来替换路由记录,从而实现路由不存历史记录的情况,以下是楼...转载 2019-11-08 13:56:43 · 2453 阅读 · 0 评论 -
vue el-select绑定对象时,回显内容不正确,始终是最后一项
vue el-select绑定对象时,回显内容始终是最后一项一、问题描述使用el-select组件绑定类型为对象时,回显内容始终为选项的最后一项,但是通过控制台打印的信息却是所选项。使用代码:<template> <div class="page-index"> <el-form :model="ruleForm" :rul...原创 2019-10-30 14:55:32 · 7658 阅读 · 4 评论 -
DatePicker日期格式化后,报错TypeError dateObject.getTime is not a function
DatePicker日期格式化后,报错TypeError dateObject.getTime is not a function.一、问题描述使用element-ui的DatePicker组件时,需要把日期格式化为yyyy-mm-dd格式,且日期为必填选项,需要对其进行校验。使用代码如下:<el-form-item label="开始时间" prop="startTime">...原创 2019-10-28 14:52:44 · 1198 阅读 · 0 评论 -
【vue warning】avoid mutating a prop directly
[vue warning] avoid mutating a prop directly一、问题描述使用props,通过父组件给子组件传值,子组件在使用props中的属性时,直接对props中的属性进行了修改。修改方式为直接对props中的属性赋值,或者使用双向绑定。父组件代码:<categroy :course="item" />子组件代码:<template&...原创 2019-10-28 11:10:17 · 15807 阅读 · 0 评论 -
vue动态加载图片--图片不存在时,显示默认图片
vue动态加载图片–图片不存在时,显示默认图片一、背景显示课程信息时,需要根据courseId为每一门课程绑定相应的课程图片。课程图片放在前端/src/assets/picture/course中。使用require导入图片时,若图片不存在,页面出现error,显示模块找不到。二、初始的动态绑定方式1、图片存放目录2、script代码使用计算属性计算图片路径export defaul...原创 2019-10-16 15:30:20 · 4576 阅读 · 0 评论