在backcraftjs中，您可以从组件内触发组件重新渲染吗

Question

这里有一个不起作用的backcraftjs组件：

class ClickButton extends Component {
constructor(kwargs) {
super(kwargs);
this.clicked = false;
}

toggleButton() {
this.clicked = !this.clicked;
}

bdElements() {
return e.div(
{
className: this.clicked ? 'clicked' : '',
bdAdvise: {click: 'toggleButton'}
},
'Click Me'
);
}
}

也就是说，组件不使用"；点击"；在你点击它(当然它没有(之后开始上课。

我可以将其更改为使用手表，然后从外部触发更改：

class ClickButton extends Component.withWatchables('isClicked') {    
bdElements() {
return e.div(
{
bdReflect: {
className: ['isClicked', c => c ? 'clicked' : '']
},
bdAdvise: {click: this.kwargs.toggleClick}
},
'Click Me'
);
}
}

但是，有没有办法将这一切保持在组件内部？类似ReactJS组件状态的东西，您在其中进行更改，它会导致组件重新呈现并反映新状态？

Answer 1

从最后开始的关键问题：

但是有什么方法可以将这一切保持在组件内部吗？类似ReactJS组件状态的东西，在那里你进行了更改导致组件重新呈现并反映新状态？

ReactJS组件状态是一个聚合状态：它几乎总是控制组件的多个方面(总是使用非平凡组件(。并且改变这些方面中的一个意味着改变聚合状态对象；重新渲染"；整个组件的。您当然可以按照这个模型构建回溯组件，但回溯并不是为了遵循这样的模型而设计的(对于其他论坛中讨论的理性工程目标(。

现在转到操作的特定示例，请注意，第一个解决方案在ClickButton实例的公共接口上公开属性clicked。因此，很明显，这个例子并没有"；保持这一切在组件内部"；。

我认为真正的问题是；ClickButton提供的公共接口是什么"我猜行动想要：

1. 按钮
2. 具有公共读/写布尔属性clicked
3. 每次单击按钮时切换其clicked属性
4. 当clicked属性从false变为true时，将其DOM类设置为"已单击"，反之亦然

这里有这样一个组件：

class ClickButton extends Component.withWatchables('clicked') {
bdElements() {
return e.button(
{
bdReflectClass: ['clicked', value=>(value ? 'clicked' : '')],
bdAdvise_click: e=>(this.clicked = !this.clicked)
},
'Click Me'
);
}
}

下面是上面代码的一个例子，生活在笔中：https://codepen.io/rcgill/pen/eYvrNeB

也许我没有理解这个问题的主旨，操作正在寻找方法来实现(1(私有数据，或者(2(状态突变意味着完成重新渲染。前者有规范的解决方案；您可以使用backcraft来完成后者，但如果这是您喜欢的模型，那么使用ReactJS可能会更好。