通过设置节点的indeterminate属性为true来标识该节点为半选中状态 function openResourceTreeDialog(roleId?: any){ getSysResourceSelectTree(roleId).then(res=>{ resourceTreeDialog.visible = true; resourceTreeData.value = res.result.selectTreeVo; roleResources.roleId = roleId; setTimeout(()=>{ const checkedKeys = res.result.selectedResources const checkedLeafKeys = [] checkedKeys.forEach((item) => { const node = resourceTreeRef.value!.getNode(item.sysResourceId) if(item.isHalfChecked){ node.indeterminate = true; }el.... element plus设置树节点状态为半加载 程序人生
说明 跟着迪佬的vue系列文章,自己搭建了前端,特此记录一下,git项目地址 https://gitee.com/WylLoveX/bs-web.git 迪佬文章地址 前端新手Vue3+Vite+Ts+Pinia+Sass项目指北系列文章 —— 系列文章(目录)-CSDN博客 一、vite创建项目 vite官网地址 要求node>18,全局安装yarn npm install -g yarn 创建项目 yarn create vite 启动测试 package.json的scripts属性中配置了启动命令 我们按照配置执行yarn dev就可以启动了 访问界面如下 二、集成element-plus element-plus官网地址 2.1 安装element-plus yarnadd element-plus 2.2 main.ts集成element-plus 在main.ts中添加内容,原来的配置暂时不动 import { createApp } from 'vue' import './style.css' //引入element-plus import Element.... 有更新! vue前端框架搭建 程序人生
webpack 全局安装webpack插件npm install webpack -g vue-cli 全局安装脚手架插件npm install -g @vue/cli-init 项目初始化 新建一个vue-cli-learn目录,在该目录下执行vue init webpack vue-cli-learn 然后回选择一系列配置,例如是否使用vue-router路由,是否使用ESLint,使用npm还是yarn作为包管理工具等,根据自己需要选择即可 vue脚手架项目初始化 程序人生
vue2 官方文档地址--介绍 — Vue.js (vuejs.org) 开发插件 开发在浏览器调试,浏览器界面很不友好,下载一个google浏览器插件,优化调试界面,通过点击下面的链接跳转,可以直接在对应的浏览器插件扩展管理安装,安装后记得启用插件,调试的时候会用到本地文件,要在插件管理里面开启允许访问文件URL vue-devtools安装教程 不同给浏览器得插件设置可以参考不同浏览器插件设置 也可以在git自己下载编译 github项目地址 使用效果如下 安装 新建目录,执行 npm init -y 执行 npm install vue@2.7.14安装 新建index.html页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <h1> {{userName}},你好 </h.... 有更新! vue学习笔记 程序人生
在package.json中添加下列代码即可 set NODE_OPTIONS=--openssl-legacy-provider && 实例: "scripts": { "pre": "cnpm install || yarn --registry https://registry.npm.taobao.org || npm install --registry https://registry.npm.taobao.org ", "serve": "set NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve", "build:test": "vue-cli-service build --mode test", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, yarn run *** 报错 error:0308010C:digital envelope routines::unsupported 程序人生
1、父组件向子组件传递参数 父组件向子组件传递参数,通过props处理,属性是驼峰命名 props属性的类型有多个,常用的有下面几个[String,Number,Boolean,Array,Object,Function,Promise]等 如果传递的参数类型是Object,那么在父组件中修改这个Object的属性,子组件中也会跟着修改; eg: 子组件定义(名称ContractFileAttachment): props: { contractId: { type: String, required: true } } 父组件传递: <ContractFileAttachment :contract-id="currentContractId" /> 2、子组件调用父组件方法 子组件使用$emit调用父组件定义的方法 eg: 父组件定义一个方法,并且在父组件中引入子组件的时候,用@声明调用 <AddForm :level-array="levelArr" :state-array="stateArr" @addSuccess="addSuccess" @clo.... 有更新! VUE父子组件通信 程序人生