背景
在使用Blockly 中的category的时候,看到文档中写到 developers.google.com/blockly/gui… 想用一下hidden暂时隐藏,但是不生效
排查问题
在源码中category.js ,是如下代码
if (this.toolboxItemDef_['hidden'] === 'true') {
this.hide();
}
我写的是
<category id="id_h" hidden="true" name="Curs" toolboxitemid="categoryId"></category>
看起来没啥问题,也跟官方文档一模一样,为啥就是不生效
开始打印看看toolboxItemDef_,到底是啥
发现如下
{
...
hidden: ''
...
}
这就奇怪了,我把hidden改成别的单词,都没问题
我又在想是不是框架问题,研究发现并不是
最终如下,
以前一直以为hidden=true 是在各个框架中使用,平时没有用过
<p hidden>这个段落应该被隐藏。</p>
这样的,www.w3school.com.cn/tags/att_gl…
原来是这个属性的问题
继续查源代码,那个true获取不到,查到了这个函数 convertToolboxDefToJson
最终的最终 发现blocklyToolbox.childNodes[7].attributes[1]
这么获取 hidden 是空字符串
我再继续往下排查
原来不是Blockly的问题
是Vue生产的结构里面,hidden="true" 变成了
<category id="id_h" hidden name="Curs" toolboxitemid="categoryId"></category>
把true给去掉了
继续研究vue的问题
后续是通过修改源码,解决了问题