小编Bis*_*n95的帖子

我有一个自定义组件，当我将布尔属性设置为 false 时，该组件应该隐藏内容。除该属性外，所有其他属性都会得到反映。我一定做错了什么。

static get properties(){
      title: {
        type: String,
        attribute: 'title',
      },

      titleEnable: {
        type: Boolean,
        attribute: 'title-enable',
      },
}

constructor() {
    super();
    this.titleEnable=true;
    this.title="default";
}

render(){

    return html`                
        ${this.titleEnable 
        ? html`
        <p class="title" ?hidden="${!this.titleEnable}">${this.title}</p>
        `
        : html ``} 
    ` 
}

如果我像<my-component></my-component>在 HTML 文件中一样使用该组件，它会显示：按预期默认。

如果我像这样使用它：<my-component title="New Title"></my-component>它会显示：按预期新标题。

但如果我尝试隐藏它，<my-component title-enable="false"></my-component>布尔值就不会改变。我已经尝试过 !title-enable、title-enable='false"、.titleEnable=false 以及您能想象到的所有变体。最让我生气的是，每当我在构造函数中设置 'this.titleEnable=false' 和我碰巧只是在标签上声明了没有值的变量，并将其视为 TRUE，出现“默认值”。<my-component title-enable></my-component>我完全迷失了。