随笔分类 - Vue.js
vue3多环境配置，vue3环境变量.env.development，cnpm run dev、cnpm run stage、cnpm run build，cnpm run build选择不同环境
摘要：参考：https://blog.csdn.net/perfect2011/article/details/1299308191.新建环境配置文件，根目录.env 基础系统变量，无论何种环境，都可使用其中配置的值，其他环境中的变量会覆盖.env中的同名变量。.env.development 开发环境.
阅读全文
ElementUI的Table控件，合并列
摘要：spanRows: [],//需要合并的行spanMap: [],//从第几行到第几行需要合并 //计算需要合并的行号 for (let k = 0; k < that.tableData.length; k++) { //判断当前系统货号是否与下一个一致，如果一致则当前行单元格需要合并。 let
阅读全文
Object.assign()详解，Object.assign()与$.extend()合并对象，浅拷贝，js给现有对象增加新属性，Object.defineProperty详解(允许精确地添加或修改对象上的属性)
摘要：一、简介：Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。简单来说，就是Object.assign()是对象的静态方法，可以用来复制对象的可枚举属性到目标对象，利用这个特性可以实现对象属性的合并。 二、用法：Object.assign(
阅读全文
Vue网站发布到iis后提示404页面不可访问
摘要：参考：https://www.cnblogs.com/yhnet/p/14804869.htmlvue重定向和跨域配置：https://zhuanlan.zhihu.com/p/5306882511.安装组件：URL Rewrite：https://www.iis.net/downloads/mic
阅读全文
TypeScript数据类型，TypeScript 与组合式 API
摘要：参考：https://ts.nodejs.cn/docs/handbook/typescript-in-5-minutes.htmlTypeScript 与组合式 API：https://cn.vuejs.org/guide/typescript/composition-api.htmlTypeSc
阅读全文
vue3.2+ts报错：找不到模块“./App.vue”或其相应的类型声明。
摘要：解决方法：在项目根目录创建 env.d.ts 文件（如果已有，则在文件中追加）加入下面内容： declare module '*.vue' { import type { DefineComponent } from 'vue'; const vueComponent: DefineComponen
阅读全文
npm设置、cnpm安装、pnpm安装、npm使用淘宝镜像、使用nvm管理nodejs版本
摘要：使用nvm管理nodejs版本：https://www.cnblogs.com/worldforest/p/18281008cmd运行起来(以管理员身份运行)，或者在VSCode的控制台//使用阿里云定制的cnpm命令行工具代替默认的npm，全局安装，并设置镜像地址。npm install -g c
阅读全文
vue.js函数模板引用
摘要：// 参考网址：https://cn.vuejs.org/guide/essentials/template-refs.html#ref-on-component// https://cn.vuejs.org/guide/essentials/template-refs.html// 模板引用也可以
阅读全文
nvm切换node.js环境工具
摘要：最新安装参考：https://www.cnblogs.com/worldforest/p/18281008下载地址：https://nvm.uihtm.com/download.html安装目录：E:\develop\nvm 找到 settings.txt增加配置，使用淘宝镜像：node_mirro
阅读全文
pinia持久化存储插件pinia-plugin-persist和pinia-plugin-persistedstate
摘要：官方文档：https://seb-l.github.io/pinia-plugin-persist/#vue3安装：npm i pinia-plugin-persist --save使用，注意是pinia.use(piniaPersist) import { createApp } from 'vu
阅读全文
vue3在单独的js文件中使用pinia报错：getActivePinia was called with no active Pinia. Did you forget to install pinia?
摘要：1、之前在main.js中使用方式是：import { createPinia } from 'pinia' const pinia = createPinia(); app.use(pinia);2、现在的问题是我要再建一个js文件，需要用到我建的pinia的store，然后报错：getActiv
阅读全文
vue3工具函数，取响应式的变量值，生成一个新的响应式变量，插入响应式数组。
摘要：取响应式的变量值，生成一个新的响应式变量，插入响应式数组，这样防止每次插入数组的是同一个响应式变量，导致数组里面有多个元素，但全部是同一个值：var newRefArtName = ref(unref(artName)); 1、isRef() 检查某个值是否为 ref。var res = isRef
阅读全文
js几种循环方式
摘要：1 let orderId = [] for(var i in this.selectedData){ console.log(this.selectedData[i])//打印可看到取到的值 orderId.push(this.selectedData[i].orderId)//取到数组每一个对象
阅读全文
vue3的状态管理方案pinia/类似于vue2的VueX
摘要：pinia官网：https://pinia.vuejs.org/pinia菠萝挺不错，简单又灵活。1.安装：yarn add pinia 或者 npm install pinia，全局加 --location=global2.注册使用 main.js import { createApp } fro
阅读全文
vue3/透传 Attributes/插槽 Slots/依赖注入/组合式函数
摘要：透传 Attributes：https://cn.vuejs.org/guide/components/attrs.html插槽 Slots：https://cn.vuejs.org/guide/components/slots.html依赖注入：https://cn.vuejs.org/guide
阅读全文
vue3组件传值defineProps/回调defineEmits/子组件属性defineExpose/'defineProps' is not defined/Unexpected 'debugger' statement no-debugger/no-unused-vars/is assigned a value but never used
摘要：使用defineProps进行父子组件传值，报异常：'defineProps' is not defined，没法用，看了很多文章都说配置在vue.config.js中：我的vue-cli版本是5.0.8 ，2022-08月装的。 module.exports = { env: { "node":t
阅读全文
vue3将对象转为响应式/ref/reactive/toRefs/isRef/watchEffect()/unref
摘要：一、ref 的作用就是将一个原始数据类型（primitive data type）转换成一个带有响应式特性的数据类型，原始数据类型共有7个，分别是：String/Number/BigInt/Boolean/Symbol/Null/Undefined用法 》头部导入：import {ref} from
阅读全文
vue中计算属性computed和watch的区别
摘要：vue3计算属性：https://vuejs.org/guide/essentials/computed.htmlmethods、watch、computed都是以函数为基础的，但各自却都不同。1、methods 不存在缓存，执行一次运行一次，执行n次，运行n次。2、computed 使用场景：当页
阅读全文
vue.js使用element-ui 和 el-cascader
摘要：安装：npm i element-ui -S回显：https://blog.csdn.net/weixin_42125732/article/details/118103756import { regionData,CodeToText,TextToCode } from 'element-chin
阅读全文
abp框架中vue.js文本框输入了数据仍然校验失败
摘要：例如（用的是IView前端组件、建议使用ElementUI免费的）： <FormItem :label="L('ProductPrice')" prop="price"> <Input v-model="formModel.price" :maxlength="32"></Input> </Form
阅读全文
