vue.2x
关注
分享
扫一扫
Wxinin
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
vue2使用高德地图实现标记点和窗体
封装地图组件<template> <!-- 标点map --> <div class="initMaped"> <div id="screenMap" class="screenMap"></div> </div></template><script>export default { name: "initMarkerMap", props: { iconList:原创 2021-12-18 11:27:54 · 663 阅读 · 1 评论 -
es6实现数组对象深度去重
定义初始cur为空数组let objLip = {}; this.msgList = res.data.reduce((cur, next)=> { objLip[next.id] ? '' : objLip[next.id] = true && cur.push(next); return cur; }, []) }原创 2021-12-08 10:04:55 · 215 阅读 · 0 评论 -
element ui可选择树形组件的回显问题
default-checked-keys传入的是被选中的子节点的id数组default-expanded-keys带父节点的id数组例如:list1是所有被选中的子节点,list是包含父节点的数组<el-tree :default-checked-keys="checkedList" :default-expanded-keys="expandedList" </el-tree>...原创 2021-11-26 09:02:10 · 635 阅读 · 0 评论 -
vue和jquery中使用videoJs播放m3u8格式视频流
vue中下载npm i video.jsnpm i videojs-contrib-hls引入import Videojs from “video.js”;import “video.js/dist/video-js.css”;import “videojs-contrib-hls”;// 播放视频<template><div style="height: 20vh"> <video ref="vi原创 2021-11-23 16:49:19 · 1393 阅读 · 0 评论 -
element ui表格实下拉筛选功能(纯前端)
1、default-sort中prop传入要排序的字段(接口返回或自己定义的数据)、order代表排序，这里用到降序2、filters对象中text代表页面中显示的筛选文字,value代表筛选用到的值,在方法中filterHandler用到3、column 的 key，如果需要使用 filter-change 事件，则需要此属性标识是哪个 column 的筛选条件(绑定的是要对接口中排序的字段)4、数据过滤的选项是否多选（multiple代表是否查询多条）5、fliter-methods:数据过滤.原创 2021-11-15 16:53:22 · 3799 阅读 · 3 评论 -
element ui表单重置
for (var key in this.ruleForm) { this.ruleForm[key] = null; }原创 2021-11-12 13:16:59 · 387 阅读 · 0 评论 -
element清除表单校验
let _this = this;setTimeout(() => {_this.$refs["ruleForm"].clearValidate();}, 30);原创 2021-11-12 13:02:20 · 1577 阅读 · 0 评论 -
element ui联级选择器回显问题
element ui联级选择器回显给数组的id赋值即可原创 2021-11-10 18:23:10 · 337 阅读 · 1 评论 -
element下拉菜单回显问题
表格中操作弹窗获取到下拉菜单数据,但是无法回显这是因为element规定绑定的数据为字符串,而当我们绑定接口返回数据时,数据格式往往不确定在编辑的点击事件中,使下拉菜单v-model的值变为字符串即可回显.( + “”)// 编辑事件 editDeviceCase(val) { let data = JSON.parse(JSON.stringify(val)); this.valueSet = data.greenName + ""; }, <el-form原创 2021-11-10 17:32:30 · 1972 阅读 · 1 评论 -
vue中如何使用element的日历组件
完整代码附上<template> <div class="newSeeds" id="famerCalendar"> <div class="title-bottom"> <el-date-picker :clearable="false" prefix-icon="timeFilter" v-model="value2" type="month" pla...原创 2021-09-29 14:19:24 · 1729 阅读 · 11 评论 -
vue动态渲染echarts,以及多次调用组件数据更新时组件无法同步刷新详解
数据在vue中是被灵活操作的当遇到如图这种echarts的数据需要通过接口获取,并且进行相应的删除和添加操作时,echarts的数量与数据要与数据同步刷新想要独立的echarts动态渲染,我想到通过封装echarts组件通过props传递接口数据来实现import yearCom from "./yearCom.vue";//在父组件中引入封装好的echarts组件export default { components: { yearCom },//注册组件 data() {} }我原创 2021-07-21 15:07:05 · 2522 阅读 · 3 评论 -
深入解读vue数据劫持代理
首先我们来创建一个对象来模拟vue中的data选项let data={name:'A',age:18}接下来模拟组件的实例let _this={}实现数据劫持代理就是实现_this中有data中的属性利用的原理是:Object.defineProperty()1.参数一：_this:要设置的目标对象2.参数二：item:添加的属性3.参数三：{}是一个对象，对应的是值//遍历data (data是对象，这里我们用for(key in Object)来遍历)for(let ite原创 2021-05-13 10:35:21 · 338 阅读 · 0 评论 -
vue的Template三种写法
一、选项模板：在构造器中用··写二、Template标签模板：在body中写template标签，然后通过id在构造器中绑定三、script标签模板：在script标签中写，值得注意的是，此时的type=“x-template” ，也是通过id在构造器中绑定，可以通过src来引用外部文件，使代码简洁。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <met原创 2021-03-24 22:36:33 · 2015 阅读 · 1 评论