js中怎样把<专为&lt;

Posted 2023-03-20

js中哪个方法把<专为< >专为>

参考技术A 为了你这个问题,我在网上查了很长时间;一般的做法是直接用js的字符串替换函数进行replace,这个的前提是你需要知道其对应关系;第二种就是用jquery,它是对javascript的封装,利用如下可以实现转义;var html=$("p").text('<>').html(); // <> 参考技术B 问题描述不是很清楚，如果你是要对特别字符进行替换的话

example:

reg = '<';

str = str.replace(reg,'&');

欢迎继续提问

Vue.js怎样把递归组件构建为树形菜单

Vue.js 递归组件实现树形菜单
main.js 作为入口：

import Vue from \'vue\'import main from \'./components/main.vue\' new Vue( el: \'#app\', render: h => h(main))

它引入了一个组件 main.vue：

<template> <div> <my-tree :data="theData" :name="menuName" :loading="loading" @getSubMenu="getSubMenu"></my-tree> </div></template> <script>const myData = [ id: \'1\', menuName: \'基础管理\', menuCode: \'10\' , id: \'2\', menuName: \'商品管理\', menuCode: \'\' , id: \'3\', menuName: \'订单管理\', menuCode: \'30\', children: [ menuName: \'订单列表\', menuCode: \'31\' , menuName: \'退货列表\', menuCode: \'32\', children: [] ] , id: \'4\', menuName: \'商家管理\', menuCode: \'\', children: [] ]; const subMenuData1 = parentId: \'1\', children: [ menuName: \'用户管理\', menuCode: \'11\' , id: \'12\', menuName: \'角色管理\', menuCode: \'12\', children: [ menuName: \'管理员\', menuCode: \'121\' , menuName: \'CEO\', menuCode: \'122\' , menuName: \'CFO\', menuCode: \'123\' , menuName: \'COO\', menuCode: \'124\' , menuName: \'普通人\', menuCode: \'124\' ] , menuName: \'权限管理\', menuCode: \'13\' ]; const subMenuData2 = parentId: \'2\', children: [ menuName: \'商品一\', menuCode: \'21\' , id: \'22\', menuName: \'商品二\', menuCode: \'22\', children: [ menuName: \'子类商品1\', menuCode: \'221\' , menuName: \'子类商品2\', menuCode: \'222\' ] ]; import myTree from \'./common/treeMenu.vue\'export default components: myTree , data () return theData: myData, menuName: \'menuName\', // 显示菜单名称的属性 loading: false , methods: getSubMenu (menuItem, callback) this.loading = true; if (menuItem.id === subMenuData1.parentId) this.loading = false; menuItem.children = subMenuData1.children; callback(menuItem.children); setTimeout(() => if (menuItem.id === subMenuData2.parentId) this.loading = false; menuItem.children = subMenuData2.children; callback(menuItem.children); , 2000); </script>

subMenuData1, subMenuData2 存放子菜单数据，可以从服务器获取，以实现动态加载。
该文件引入了树形组件 treeMenu.vue：
<template> <ul class="tree-menu"> <li v-for="(item, index) in data"> <span @click="toggle(item, index)"> <i :class="[\'icon\', item.children && item.children.length ? folderIconList[index] : \'file-text\', loading ? loadingIconList[index] : \'\']"></i> item[name] || item.menuName </span> <tree-menu v-if="scope[index]" :data="item.children"></tree-menu> </li> </ul></template> <script>export default name: \'treeMenu\', props: data: Array, name: String, loading: Boolean , data () return folderIconList: [], loadingIconList: [], scope: , created () this.data.forEach((item, index) => if (item.children && item.children.length) this.folderIconList[index] = \'folder\'; ); , methods: doTask (index) this.$set(this.scope, index, !this.scope[index]); this.folderIconList[index] = this.scope[index] ? \'folder-open\' : \'folder\'; , toggle (item, index) this.loadingIconList = []; if (item.children && item.children.length) this.doTask(index); else this.loadingIconList[index] = \'loading\'; this.$emit(\'getSubMenu\', item, (subMenuList) => if (subMenuList && subMenuList.length) this.doTask(index); ); </script> <style scoped>.tree-menu list-style: none;.tree-menu li line-height: 2;.tree-menu li span cursor: default;.icon display: inline-block; width: 15px; height: 15px; background-repeat: no-repeat; vertical-align: -2px;.icon.folder background-image: url(/src/assets/folder.png);.icon.folder-open background-image: url(/src/assets/folder-open.png);.icon.file-text background-image: url(/src/assets/file-text.png);.icon.loading background-image: url(/src/assets/loading.gif); background-size: 15px;</style> 参考技术A 采用路由的重定向即可