介绍
validatable: 是否使用组件内置的校验
autoCorrect: min > max 时自动换位、autoCorrect:true + allowHalf:false 时可能会将 null 变为 0
allowHalf: 是否允许「一个数字、一个 null」、autoCorrect:true + allowHalf:false 时将 null 变为 0
用法
<NumberRange v-model:value="form.valueRange" />
<NumberRange v-model:value="form.valueRange" :allowHalf="false"...
导出
let data = JSON.stringify(localStorage, null, 2);
let blob = new Blob([data], {type: "text/plain;charset=utf-8"});
let url = URL.createObjectURL(blob);
let link = document.createElement('a');
link.href = url;
link.download = 'LocalStorage_' + new Date().toISOString().replace(/[^0-9a-z]/ig, '') + '.txt';
link.click(...
对齐：用 style=”text-align:center” 属性代替 quill 的 class=”ql-align-center” 版对齐功能
import Quill from 'quill';
const QuillAlign = Quill.import('attributors/style/align');
QuillAlign.whitelist = ['right', 'center', 'justify'];
Quill.register(QuillAlign, true);
字号：用 style=”font-size:18px;” 代...
目标
将对象的所有 key 配置给 watch
代码
const ImageableFields = [
'cover',
'detail',
'reply',
];
// 转换为 FormItem.prop: cover -> form._images_cover
const WatchableFields = ImageableFields.ma(v => `form._images_${v}`);
export default {
props: {
detail: {
type: Object,
default: () => ({}),
},
},
data() {...
自定义组件内部在 blur 和 change 后增加：
import emitter from 'element-ui/src/mixins/emitter';
let {
methods: { dispatch },
} = emitter;
methods: {
onChange () {
dispatch.call(this, 'ElFormItem', 'el.form.change', this.value);
},
onBlur () {
dispatch.call(this, 'ElFormItem', 'el.form.blur', this.value);
}
}
也可...
可以不使用 vite-plugin-mock 只引入 mockjs，但是只使用 mockjs 的话配置会繁琐；vite-plugin-mock 做了将 mockjs 集成到 vite 的工作。
package.json
yarn add -D mockjs vite-plugin-mock
.env
VITE_MOCK_ENABLED=true
vite.config.js
import { loadEnv, defineConfig } from 'vite';
import { viteMockServe } from 'vite-plugin-mock';
export default ({ mode }) => {
const ENV ...
用法
let status = true;
v-loading="status"
JS
const toggleLoading = (el, binding) => {
if (binding.value) {
let dom = `
<div class="el-loading-mask">
<div class="el-loading-spinner">
<svg viewBox="25 25 50 50" class="circular">
<circle cx="50" cy="50&qu...
官方文档在这里：https://vitejs.dev/config/
让 Vue 认出 html 原生的 marquee 标签
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
export default () => {
return defineConfig({
plugins: [
vue({
template: {
compilerOptions: {
isCustomElement: (tag) => ['marquee'].includes(ta...
概要
yarn build 后自动生成并在 finder 中高亮 .tgz 压缩包，压缩包名含项目名称、生成日期、git commit id，并提示是否将生成的 dist 和 .tgz 删除。
压缩包名格式：《某可视化大屏_production_20230326214235_52905e7.tgz》
依赖：macOS，fish shell
用法
yb # 仅 yarn build，NODE_ENV=production
yb production # 仅 yarn build，NODE_ENV=production
yb development ...
提示：windows 平台需要在 git bash 中执行以下操作。
生成自动登录 ssh 的 key，这个 key 可以代替 ssh 密码，后边再使用 scp 复制文件时就不需要输入密码这步交互操作了
ssh-keygen
# 不需要输入信息，一路回车即可
将 ssh key 添加到服务器上
ssh-copy-id -i ~/.ssh/id_rsa.pub -p 22 root@106.13.232.33
# 按提示输入 admin 的密码
本地配置 ssh 主机（用“vueProjectHost”代替“root@106.13.232.33”）
# ~/.ssh/...
引入 mxGraph
旧方法
yarn add mxgraph-js # 这个包里的 mxgraph 版本号为 3.6.0
import {
mxGraph,
mxUtils,
mxHierarchicalLayout,
mxCellOverlay,
mxEvent,
mxRubberband,
mxKeyHandler,
mxConstants,
mxImage,
} from 'mxgraph-js';
官方用法
yarn add mxgraph # mxgraph 版本号 4.2.2
import * as mxgraph from 'mxgraph';
const {
mxGraph,
mxUtils,
m...
用法
this.$dialog.show({
title: "Dialog",
width: "50%",
data: { name: "name", age: 18 }, // 非编辑时此项可省略
option: {
confirmText: "保存", // 可省
columns: [
{
label: "姓名",
prop: "name",
rules: [
{
required: true,
message: &quo...
