vue
vue.js
我兔威武
哒哒哒哒
展开
-
手机号和身份证号验证
<el-form-item label="联系电话" prop="telephone"> <el-input v-model.number="sizeForm.telephone"></el-input> </el-form-item> <el-form-item label="身份证号码" prop="identityId"> <el-input v-model="sizeForm.identityId"></el-inpu原创 2020-06-18 10:13:32 · 970 阅读 · 0 评论 -
eventBus
传递方:eventBus.$emit('fnName',this,data) 接收方:eventBus.#on('fnName',function(data) {}) 在assets中创建eventBus.js文件 import Vue from 'vue' const eventBus = new Vue() export default eventBus 在传递方和接收方都引入eventBu...原创 2020-03-30 15:35:15 · 239 阅读 · 0 评论 -
默认表格首行高亮
setCurrentRow 用于单选表格,设定某一行为选中行,如果调用时不加参数,则会取消目前高亮行的选中状态。原创 2022-08-10 16:03:57 · 645 阅读 · 0 评论 -
el-select change事件获取label的值
el-select change事件获取label的值。原创 2022-09-05 09:11:44 · 990 阅读 · 1 评论 -
高频面试题 —— vue
vue 钩子函数 vue 双向绑定 vuex 虚拟dom v-show v-if 组件通信 methods 、computed 和watch区别 vue权限管理 scoped属性 前端路由 vue 钩子函数 beforeCreate→created→beforeMount→mounted→beforeUpdate→updated→beforeDestroy→destroyed 组件创建期间的4个钩子函数 beforecreated:el、methods 和 data 并未初始化 created:完成了 d原创 2021-04-09 10:27:33 · 327 阅读 · 0 评论 -
el-date-picker 日期选择器 无法更改
表格修改功能弹框,发现时间框数据无法修改原创 2022-09-02 10:47:51 · 756 阅读 · 0 评论 -
关于vue-awesome-swiper坑爹的二三事
官网地址:https://github.com/surmon-china/vue-awesome-swiper 跟着官网一顿操作之后,我的轮播图不会自己动 -_- 第一个坑就是autoplay要加一句代码 swiperOption: { pagination: { el: ".swiper-pagination", }, slidesPerView:1, loop: true, autoplay: {原创 2020-09-14 11:03:36 · 260 阅读 · 1 评论 -
步骤引导组件 ~ vue-intro
以下是我一边写一边记录的过程~~ vue-introjs 的 github 地址 首先下载安装introJs和vue-introjs npm install intro.js --save npm install vue-introjs --save 在main.js 引入 import VueIntro from 'vue-introjs'; Vue.use(VueIntro); import 'intro.js/introjs.css'; 在 vue.config.js 里添加 我的原创 2020-11-03 15:26:39 · 2242 阅读 · 1 评论 -
vue el-upload 上传接口增加 token
上传导入时,接口需要携带 token ,组件用的是 el-upload ,我们把 token 放到 headers 里即可。原创 2022-09-02 10:38:39 · 3872 阅读 · 0 评论 -
vue-cli的执行流程
1.入口文件是main.js 模块的导出:export default {} 模块的导入:import Vue from 'vue' 2..vue文件是vue-cli把组件封装的单独文件 <template></template>// 存放html, 一定要有一个根元素 <script></script>//存放js, 一定要 export defa...原创 2020-03-27 15:05:57 · 642 阅读 · 0 评论 -
element 步骤条
步骤条原本是 description 内容,现在要修改一下内容的排版 代码如下 <el-steps direction="vertical" :active="1" > <el-step v-for="(item, i) in stepData" :key="i" :title="i原创 2021-03-01 12:10:55 · 785 阅读 · 0 评论 -
vue-pdf 跳坑
vue 项目展示 pdf 文件 当时是直接把文件放到了页面的文件夹下面,引用的时候地址直接是./01.pdf 此时没有报错,检查选中是有占位的,但是没有显示文档出来 我查了很久,一直也查不到解决方法 后来试了试线上的pdf文件,发现可以展示 然后看到官网和查到的资料,都是放到 public 或者 static 下面 我就把文件放在了 static 下面试试,发现可以 总结下来就是要么是线上的文件,要么文件就放到 public 或者 static 下面 下面是代码 <div>原创 2021-03-01 10:14:03 · 1915 阅读 · 1 评论 -
vue字符串拼接添加点击事件
html += `<button class="el-button el-button--small" οnclick="onSubmit()">主要按钮</button>` 在methods中添加onSubmit函数不起作用,应该在下面直接写 window.onSubmit =function(){ console.log(123) }原创 2020-07-06 16:59:57 · 2893 阅读 · 3 评论 -
vue表格判断
<el-table :data="personIdList" style="width: 100%" max-height="350" > <el-table-column prop="userGender" ...原创 2020-09-02 09:27:47 · 1653 阅读 · 0 评论 -
vue element input回车事件
实现敲回车键发送 <el-input type="textarea" :rows="4" placeholder="请输入指令内容" v-model="value" @keyup.enter.native="handleClick"> </el-input> <原创 2021-03-29 18:11:45 · 749 阅读 · 0 评论 -
element 级联选择器获取自定义属性
<el-cascader ref="cascaderAddr" :options="options" :props="props" collapse-tags size="small" clearable @change="cascaderChange" v-model="c...原创 2021-03-29 10:42:16 · 846 阅读 · 0 评论 -
vue配置路由
1.下载 vue-router 先看看package.json有没有vue-router,没有的话下载 npm i vue-router 2.在 main.js 中引入 vue-router import VueRouter from 'vue-router' 3.调用一个方法(固定写法):Vue.use(VueRouter) Vue.use(VueRouter) 4.HTML代码 左侧代码...原创 2020-03-27 16:07:49 · 1006 阅读 · 0 评论 -
动态表头 el-table el-dropdown el-checkbox
动态表头 el-table el-dropdown el-checkbox原创 2022-06-27 10:16:44 · 845 阅读 · 0 评论 -
级联选择器获取选中的文字
以官网的第一个为例。要获取选中数据的id handleChange(value) { console.log(value); } 但是想要获取label,即选中数据的文字(指南 / 设计原则 / 一致) let label = this.$refs['label '].presentText//记得添加ref ...原创 2020-06-08 14:19:24 · 1046 阅读 · 0 评论 -
vue项目打包报错
[Error: EPERM: operation not permitted, unlink 'D:\OperationSchedule\dist\static\css'] { errno: -4048, code: 'EPERM', syscall: 'unlink', path: 'D:\\OperationSchedule\\dist\\static\\css' npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! websinochem原创 2020-05-18 16:40:09 · 933 阅读 · 0 评论 -
表单移除校验
resetField 对该表单项进行重置,将其值重置为初始值并移除校验结果 clearValidate 移除该表单项的校验结果 this.$nextTick(() => { this.$refs.ruleForm.clearValidate(); }); this.$nextTick(() => { this.$refs.ruleForm.resetField(); }); ...原创 2021-03-10 09:51:44 · 606 阅读 · 0 评论 -
表单必填项
坑一:因为一开始没有要求必填项,所以没在el-form-item上加prop,导致在data里面写了rules不管用; 坑二::rules="rules"忘记加冒号 坑三:ref="sizeForm" :model="sizeForm" ref和model要一样 坑四:<el-form-item label="姓名" prop="name"> <el-input v-model="sizeForm.name" autocomplete="off" ></el-input>原创 2020-06-17 15:00:41 · 1302 阅读 · 0 评论