项目笔记

项目开发笔记

VueTreeselect

官方网站：https://vue-treeselect.js.org

相关博客：

• https://www.cnblogs.com/javahr/articles/13607024.html

禁用或只读

加上 :disabled='true' 就好

双引号内可以添加作为标志位的变量名

VueTreeselect显示unknown解决方法

treeselect 绑定的值需要与options输出的id相对应，若是空值，请不要给空字符串，0，等，因为会出现unknown，并且当选择了值以后，会出现选中的值后面会拼上unknown。

解决办法就是把v-modle绑定的值设为null，必须是null，不能是‘null’，初始化的时候才不会出现unknown。

选项为空时 用中文提示

<treeselect
	v-model="xxxx"
	:multiple="false" 
	:options="xxxx"
	:show-count="false"
	:disable-branch-nodes="false"
	:searchable="false"
	clearValueText="清除"
	noOptionsText="暂无数据"
	placeholder="请选择"
/>

[vue-treeselect warning] invalid node id

树节点的id不要留空

Vue Treeselect使用常见问题汇总及解决办法

相关博客：

• https://blog.csdn.net/m0_67392010/article/details/123367976

基本使用

相关博客：

• https://blog.csdn.net/qq_60035188/article/details/124936953

:style 动态样式

<tag :style=" 布尔表达式 ? ' background-color : #fff; color : #000 ' : '' "></tag>

通过base64编码下载图片

相关博客：

• https://blog.csdn.net/m0_60067716/article/details/124628308

项目错误笔记

Avoid mutating a prop directly since the value will

相关博客：

• https://blog.csdn.net/weixin_45890764/article/details/117434292

Are you meant to dynamically load options

vue date中修改对应loadOptions参数不为空即可

 data() {
      return {
      		//修改前
			deptOptions: undefined,
			//修改后
			deptOptions: [],
	  }
}

You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

报错内容：

你正在使用’仅有运行时环境’的Vue构建版本，该版本中template编译器不可用。要么预编译模板，使其变为render函数，或者使用’包含编译器’的Vue构建版本。

方案1

将main.js中的

import Vue from 'vue'

更改为

import Vue from 'vue/dist/vue.js'

方案2

1. 在项目根目录创建 vue.config.js 文件，编写如下代码

module.exports = {
    runtimeCompiler: true
}

2. 重新运行项目

项目搭建笔记

创建Vue项目

快捷创建vue项目，在命令行输入

vue create 项目名

需要注意使用vue的哪个版本进行构建（Vue2还是Vue3）

借鉴若依框架

借鉴若依框架时需要注意环境的问题

注意项目中以 .env 开头的配置文件中的内容，以及启动时生效的配置文件

vue.config.js 在进行端口号、代理的后端地址的设置的时候，很多时候都是从配置文件中拿到的值，这里需要注意