if (data.data.length > 0) { data.data.forEach(item => { this.stuNewsJson.message.push({ label: item.projectName, content: item.projectDescribe }); if (item.projectDescribe === '上传附件') { this.showButton = true } else { this.showInput = true } console.log(item) }); }这个代码该怎么优化控制显示隐藏
时间: 2023-12-10 10:39:03 浏览: 26
你可以将 `showButton` 和 `showInput` 的初始值设为 `false`,然后在 `forEach` 循环中根据 `item.projectDescribe` 的值来更新它们的值。可以尝试如下代码:
```
this.showButton = false;
this.showInput = false;
if (data.data.length > 0) {
data.data.forEach(item => {
this.stuNewsJson.message.push({
label: item.projectName,
content: item.projectDescribe
});
if (item.projectDescribe === '上传附件') {
this.showButton = true;
} else {
this.showInput = true;
}
console.log(item);
});
}
```
这样,`showButton` 和 `showInput` 的值将会根据具体的情况被更新,从而控制显示和隐藏。
相关问题
handleNodeClick(data) { if (this.type == "information") { if (!data.son.length) { if (data.code) { this.$emit("getDimension", data, true); getEchaersSate(data, this.localCompany.com_id).then((res) => { this.$emit("getEchartsData", res.data.data, false); }); } else { console.log("code为空"); this.$message({ type: "error", message: "该维度暂无数据,请选择其他维度对比", }); } } else { console.log("无数据"); } } else if (this.type == "theme") { if (!data.son.length) { if (data.code) { this.$emit("getDimension", data, true); let parameter = { company: [], expression: [], }; // 请求参数数据处理 this.ipcParameter.forEach((item) => { if (item.ipc.length == 0) { console.log("无ipc"); } else { parameter.company.push(item.name); let datas = `pat_int_cl =(` + item.ipc[0].code + `)`; item.ipc.forEach((ele, index) => { if (index > 0) { datas = datas + ` or pat_int_cl =(` + ele.code + `)`; } }); let expressions = `( ` + datas + ` )`; parameter.expression.push(expressions); } });
根据你提供的代码,`handleNodeClick`方法中并没有取消事件的默认行为或阻止事件传播的代码,所以这个问题应该与事件处理无关。如果`disabled`属性仍然无法生效,可能是因为其他代码正在影响它的行为。
下面是一些可能的问题和解决方案:
1. 确保你没有在父组件中使用了`v-if`或`v-show`等指令来控制`el-tree`的显示。如果你这样做了,并且条件不满足,则整个`el-tree`会被移除,`disabled`属性也将失效。
2. 确保你没有在`el-tree`的父元素或祖先元素上设置了`pointer-events:none`等CSS属性。这些属性会禁用鼠标事件,导致`disabled`属性无法生效。
3. 请检查`el-tree`的父元素或祖先元素是否存在其他的鼠标事件、键盘事件或touch事件等,这些事件可能会干扰`el-tree`的默认事件。
如果以上解决方案都无法解决您的问题,建议您提供更多关于您的代码和问题的信息,这样我可以更好地帮助您调试。
router.beforeEach((to, from, next) => { if (store.getters.getRouters == null) { // 获取菜单和路由 getMenusApi(params).then((res) => { if (res.data.length === 0) { window.location.href = process.env.VUE_APP_API_BASE_CONSOLE || '' } const { data } = res const menuNav = [] const childrenNav = [] // 后端数据, 根级树数组, 根级 PID listToTree(data, childrenNav, 0) menuNav.push(...childrenNav) const routers = generator(menuNav, null) routers.forEach((r) => { router.addRoute(r) }) router.addRoute(page404) store.commit('SET_ROUTERS', routers[0].children) // 请求带有 redirect 重定向时,登录自动重定向到该地址 const redirect = decodeURIComponent(from.query.redirect || to.path) if (to.path === redirect) { // set the replace: true so the navigation will not leave a history record next({ ...to, replace: true }) } else { // 跳转到目的路由 next({ path: redirect }) } }).catch((error) => { console.log(error,'error') if (error.data.code !== 200 || error.data.data.length === 0) { setTimeout(function () { window.location.href = process.env.VUE_APP_API_BASE_CONSOLE || '' }, 5) } }) // // 获取按钮权限 // getPermissionApi(params).then((res: any) => { // if (res.data.code !== 200) return ElMessage.error(res.data.message) // store.commit('SET_PERMISSION', res.data.data) // }) // // 获取数据权限 // getRolesApi(params).then((res: any) => { // if (res.data.code !== 200) return ElMessage.error(res.data.message) // store.commit('SET_ROLES', res.data.data) // }) // // 获取用户信息 // getUserInfoApi().then((res: any) => { // if (res.data.code !== 200) return ElMessage.error(res.data.message) // store.commit('SET_USERS', res.data.data) // }) } else { next() } })
这是一个 Vue 路由守卫的代码片段,用于在路由切换前进行一些操作。其中包含了以下主要逻辑:
1. 判断 store 中的路由信息是否为空,如果为空则向后端发起请求获取菜单和路由信息。
2. 通过 getMenusApi 函数向后端发起请求,获取菜单和路由信息。如果请求成功,则将获取到的菜单和路由信息转换为前端路由,并添加到 Vue Router 中。
3. 如果请求带有 redirect 重定向参数,则自动跳转到该地址。
4. 如果 store 中已经有路由信息,则直接跳转到目的路由。
5. 如果获取菜单和路由信息失败,则跳转到 404 页面或者登录页面。
注释中的代码是一些额外的逻辑,用于获取用户信息、按钮权限、数据权限等。