随笔分类 - vue
摘要：先在main.js中设置总变量 import Vue from 'vue'; export const EventBus = new Vue(); 然后再页面中EventBus // 在组件中触发事件 EventBus.$emit('someEvent', data); // 在另一个组件中监听事件
阅读全文
摘要：把element的全选从一组改成多组 变成多个数组，能同时全选，非全选，效果如下 代码如下 uusdList: [ //数据 { country:'埃及', isUpdate: true, isIndeterminate: true, checkAll: false, checkedChannel:
阅读全文
摘要：要在 Vue Router 的 beforeEach 导航守卫中实现基于角色的访问控制，你需要先确定用户的角色，并根据该角色检查他们是否有权访问目标路由。假设你有一个地方可以获取当前用户的角色（例如，存储在 Vuex 状态管理中或通过一个 API 调用获取），你可以使用这些信息来动态地控制访问。以下
阅读全文
摘要：功能：根本文字时长设置滚动时长，鼠标移上去停止滚动，把鼠标移开继续滚动 我这个是滚动2遍则隐藏，如果需要一直滚动的，把定时关掉就了。 <template> <div id="app"> <div class="marquee"> <div class="text" :class="{ 'animat
阅读全文
摘要：一个表格中的勾选框，根据每一列的条件判断是否可以选择。只需要在table的type="selection"列新增一个selectableCallback <el-table-column type="selection" :selectable="selectableCallback"/> sele
阅读全文
摘要：在JavaScript中，要从富文本内容中提取图片路径，你可以创建一个DOM元素来作为解析富文本内容的容器，然后将富文本内容作为文本节点插入这个容器中。接着，你可以使用querySelectorAll方法和CSS选择器来选择所有的img元素，并获取它们的src属性。 以下是一个简单的示例代码 fun
阅读全文
摘要：当要修改quasar自带组件（比如，input，select）的样式时，可以使用 :deep() <style lang="scss" scoped> :deep(.q-card__section--vert) { padding: 0 16px; } </style> 参考链接 https://w
阅读全文
摘要：Vue项目 移动端禁止页面放大缩小（在安卓上可以实现禁止放大缩小，但是ios就不行） // index.html 中添加 meta 标签 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-sca
阅读全文
摘要：1、安装crypto-js； npm install crypto-js --save-dev yarn add crypto-js --dev 2、新建unit.js写成公共方法 ； const CryptoJS = require('crypto-js'); //16位十六进制数作为密钥（秘钥为
阅读全文
摘要：一、下载外部字体.ttf的文件 https://www.dafont.com/ 字体下载地址 二、在src/assets/下新建font文件夹 ，将下载的字体包放入 3、font下新建font.css，将字体包统一引入 1 @font-face { 2 font-family: "hjgakk";
阅读全文
摘要：1、给input加上ref; 1 <v-otp-input 2 ref="inputName" 3 class="opt-input" 4 length="9" 5 type="number" 6 pattern="\d*" 7 v-model="payNum" 8 plain 9 ></v-otp
阅读全文
摘要：第一种情况，直接把key写在表格上 一、所遇到的问题 在使用el-table组件时，数据已经发生了变化，但是页面显示的数据却没变化; 二、解决办法 在el-table中添加一个key，可以设置成boolean类型的，在数据更新后更新这个key; 1 <el-table :data="currentR
阅读全文
摘要：官方文档：https://v-charts.js.org/#/ 一、初次安装 npm i v-charts echarts -S 二、可以按需引入或者全局引入 全局引入如下放在main.js: import VCharts from 'v-charts'; Vue.use(VCharts); 局部引
阅读全文
摘要：TimePicker在官网中给的例子是有默认值的 <template> <el-time-picker is-range v-model="value1" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" plac
阅读全文
摘要：一、安装依赖 npm install v-viewer --save 二、在main文件引入，记得要引入样式 import 'viewerjs/dist/viewer.css'; import Viewer from 'v-viewer'; Vue.use(Viewer); 如果你需要修改viewe
阅读全文
摘要：今天在vue项目中安装node-sass出现了一个报错： 查看了一下node的版本，对应安装的node-sass版本，对比了下官网的版本号。链接：node-sass 选择下载本地nodejs对应的node-sass版本：npm install node-sass@version 这样重新安装了一下，
阅读全文
摘要：<script> import { collectService } from '@/services'; export default { prop: ['formWhere'], data() { return { dialogPop: false, isDisabled: true, webI
阅读全文
摘要：一，在textarea中加入id <el-form-item :label="$t('message_template_content')" prop="content"> <el-input type="textarea" id="textarea" :autosize="{ minRows: 5
阅读全文
摘要：复制内容至剪切版我们使用的是插件vue-clipboard2， npm install --save vue-clipboard2 在main.js引用进来就好了 //复制到粘贴板插件 import VueClipboard from 'vue-clipboard2'; Vue.use(VueCli
阅读全文
摘要：父组件调用子组件方法 父页面 <user-info ref="mychild"/> 在父级定义事件比如点击执行子组件方法 this.$refs.mychild.getListManualOperate(this.info); 上边的getListManualOperate就是子组件里的方法 子组件跟
阅读全文
