除非用户单击外部块，否则更改不会显示在古腾堡块上的数组元素上

问题描述

我正在使用数组作为属性创建块的元素，如下所示：

attributes: {
    title: {
        type: "string",source: "html",selector: "h2",default: "Lorem ipsum dolor sit amet,consectetur adipiscing elit,sed do eiusmod tempor",},tabs:{
        type:"array",default:[
            {
                id:0,tabTitle:"Lorem ipsum dolor sit amet0",tabContent:{
                    title:"Lorem ipsum dolor sit amet,content:"Lorem ipsum dolor sit amet,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor",iconText:[
                        {
                            text:"",icon:{
                                id:0,nbedefault:""
                            },}
                    ]
                },tabImage:{
                    nbedefault: ""
                },active:true
            },{
                id:1,tabTitle:"Lorem ipsum dolor sit amet1",icon:{
                                id:1,active:false
             },//so on and so on...
            
                },active:false
            }
        ]
    },

如果我想删除元素或让它们像这样，我会创建一个复选框

tabs.map((y)=>{
                                    let activeTab=(!y.active)?"not-active":"";
                                        return <>
                                            <div className={"nbe-tab-title active " + activeTab} data-link={"same"+y.id}>
                                                <input type={"checkBox"} onClick={()=>{
                                                    setTabActivation(y.id)
                                                }}   checked={y.active}/>

                                                <RichText
                                                    key="editable"
                                                    tagName="span"
                                                    placeholder="Icon's Text"
                                                    value={y.tabTitle}
                                                    onChange={(v)=> {
                                                        setTabTitle(v,y.id)
                                                        }
                                                    }
                                                />
                                            </div>
                                        </>;

和 setTabActivation 函数是这样的：

    const setTabActivation=(id)=>{
        let currentTabs=attributes.tabs;
        console.log(currentTabs[id].active)
        if(currentTabs[id].active){
            currentTabs[id].active=false;
            setAttributes({tabs: currentTabs});
        }else{
            currentTabs[id].active=true;
            setAttributes({tabs: currentTabs});
        }
    }

一切正常，问题是当我点击复选框时，我点击块外侧后才会出现更改

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）