VUE
vue框架开发中的各种细节性问题
Sophia George
路漫漫其修远兮,吾将上下而求索!撸代码之路任重而道远
展开
-
解决vue项目里window.open浏览器跳转拦截问题+需要动态传递参数
因为要携带参数row,不能直接使用window.open(),可以将onclick点击事件的方法挂载在window上。注意,window.open只能放在同步方法里,不能放在异步方法里,异步调用需要转至新页面。原创 2022-12-29 09:42:13 · 2846 阅读 · 0 评论 -
大屏可视化开发
大屏可视化开发必备要素原创 2022-08-22 18:26:57 · 1426 阅读 · 0 评论 -
vue项目如何动态变更主题色
1.在common.less中添加root元素2.在main.js中引入3.使用方式4.在app.vue中接口动态获取主题色getThemeColor() .then((res) => { //动态设置主题色 document.documentElement.style.setProperty("--theme-color", `${res.data}`); }) .catch((原创 2022-04-01 10:26:32 · 1539 阅读 · 0 评论 -
vue项目前端如何配置跨域
谷歌浏览器升级,因同源策略限制前端无法本地调试,所以需配置跨域配置方法:vue项目是使用webpack启动和打包的,所以在vue.config.js文件webpack的devserver中配置代理。//开发模式配置 devServer: { port: port, open: true, overlay: { warnings: false, errors: true },原创 2022-02-26 16:39:25 · 1448 阅读 · 0 评论 -
quill-editor使用方法,图片base64位转为url缩减字符长度,以及显示文字个数,光标位置等
下载npm install vue-quill-editor2.导入import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'import { quillEditor } from 'vue-quill-editor'3.使用 <!-- 富文本 --> <div class="editor-wr.原创 2021-12-18 14:59:47 · 1163 阅读 · 2 评论 -
完美的数字输入框,只能输入两位小数点以千分位分隔,解决iview inputnumber输入光标跳转问题
注意UI框架用的是iview<InputNumber :formatter="value => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')" :parser="value => value.replace(/\$\s?|(,*)/g, '')" :active-change="false" :max="99999999.99" :min="1" :precision="2" v-model.number="vehicleForm.mo原创 2021-12-16 15:48:34 · 1495 阅读 · 0 评论 -
iview InputNumber输入光标跳转precision精度
设置active-change="false"完美解决问题,在博客上看了好多肺功能啊,浪费时间<InputNumber :active-change="false" :max="9999999999" :min="1" :precision="2" v-model.number="vehicleForm.money" style="width:100%"></InputNumber>...原创 2021-12-16 15:18:40 · 1152 阅读 · 1 评论 -
正则表达式校验
原创 2021-12-10 14:02:16 · 83 阅读 · 0 评论 -
主页面子页面利用postMessage通讯,主页面移除message监听事件
给主页面加了消息提示,一直无限追加,需要移除监听事件,监听事件的移除dlgVisible(val) { var that = this if (!val) { this.getWorkRecordList() } else { window.addEventListener( "message", receiveMessage, true ); }原创 2021-10-22 17:26:58 · 1479 阅读 · 0 评论 -
Vuex的模块化使用
一、文件目录Vuex由于使用单一状态树,应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时,store 对象就有可能变得相当臃肿。因此,Vuex 允许我们将 store 分割成模块(module),每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块。## 标题二、在index.js中引入const store = new Vuex.Store({ modules: { app, permission, tagsVie原创 2021-05-31 16:38:03 · 526 阅读 · 0 评论 -
vue项目部署配置app.js,mine.js
标题app.jsvar port = 3298; var http = require('http');var url = require('url');var fs = require('fs');var path = require('path');var mine = require('./mine').types;var connect = require('connect');var history = require('connect-history-api-fallback'原创 2021-05-11 10:03:12 · 979 阅读 · 0 评论 -
解决vue中eslint的配置,组件代码提示慢问题
解决vscode写vue代码受eslint限制不自动格式化问题vue组件写代码提示慢,受eslint限制,不自动格式化为eslint匹配的配置方法配置步骤第一步:下载插件 vueter,pretitter,eslint,FormattingToggle第二部:在setting.json中配置{ "window.zoomLevel": 2, "workbench.colorCustomizations": { //护眼主题 "[Atom One Light]": { "edit原创 2020-05-10 13:30:08 · 3121 阅读 · 0 评论