{searchList.length !== 0 && ( <> <div style={{ fontSize: 15, color: '#9f9f9f', padding: '5px 6px' }}> 已查询到{searchList.length}条数据 </div> <div> <Checkbox.Group value={selectedList} onChange={()=>{console.log(1111);}}> <Space direction="vertical" style={{ width: '100%', backgroundColor: '#fff' }}> {searchList.map((item) => ( <Checkbox value={item.organizationId} key={item.organizationId}> <div style={{ marginLeft: 5 }}> <div className={styles.positionName}> {item.name} {mark === 'personnel' && item.positionName && <>({item.positionName})</>} </div> <div className={styles.orgName} style={{ display: mark === 'position' ? '' : 'none' }} > {item.organizationName} </div> </div> </Checkbox> ))} </Space> </Checkbox.Group> </div> </> )} 这是我写的一个公共组件，但是这个组件的onChange方法在一个tab页能执行，再另外一个tab页执行不了

I'm sorry, but the text you provided is incomplete and it is not clear what you are asking for. Could you please provide more context or clarify your question so that I can better assist you?

相关问题

在ftl模板引擎中 <#list data as saleData> <tr style="font-size: ${(saleData.team?contains('汇总') || saleData.team?contains('汇总'))?string('28px', '26px')}; color: ${(saleData.dailySalesAmount == 0)?string("#f3f3f3", '')}; background-color: ${(saleData.dailySalesAmount == 0)?string('#4472C4', '')} ${((saleData.dailySalesAmount > 0) && (saleData.dailySalesAmount < 10000))?string('#D9E1F2', '')} ${(saleData.saleArea=='CA部门' && saleData.dailySalesAmount>0 && saleData.dailySalesAmount<50000)?string('#D9E1F2', '')} ${(saleData.team?contains('汇总')?string('#f3f3f3', ''))}; font-weight: bold"> <td>${(saleData.team)!""}</td> <td>${(saleData.name)!""}</td> <td>${(saleData.tenDailySalesAmount)!""}</td> <td>${(saleData.twelveDailySalesAmount)!""}</td> <td>${(saleData.fifteenDailySalesAmount)!""}</td> <td>${(saleData.dailySalesAmount)!""}</td> <td>${(saleData.orderCount!"")}</td> </tr> </#list> 这个代码可以怎么优化

可以将一些重复判断条件的部分提取出来，减少代码重复和冗余，同时可以使用内置函数和变量简化代码：

<#list data as saleData>
    <#assign isSummary = saleData.team?contains('汇总')>
    <#assign salesAmount = saleData.dailySalesAmount>
    <#assign bgColor = (salesAmount == 0)?string('#f3f3f3', '')>
    <#assign fontColor = (salesAmount == 0)?'#4472C4' : ((salesAmount > 0) && (salesAmount < 10000))? '#D9E1F2' : (saleData.saleArea == 'CA部门' && salesAmount > 0 && salesAmount < 50000)? '#D9E1F2' : ''>
    <#assign fontSize = isSummary?string('28px', '26px')>
    <#assign fontWeight = isSummary?string('bold', '')>
    <tr style="font-size: ${fontSize}; color: ${fontColor}; background-color: ${bgColor}; font-weight: ${fontWeight}">
        <td>${saleData.team!""}</td>
        <td>${saleData.name!""}</td>
        <td>${saleData.tenDailySalesAmount!""}</td>
        <td>${saleData.twelveDailySalesAmount!""}</td>
        <td>${saleData.fifteenDailySalesAmount!""}</td>
        <td>${saleData.dailySalesAmount!""}</td>
        <td>${saleData.orderCount!""}</td>
    </tr>
</#list>

在这里，我们使用了内置函数 `contains()` 来判断字符串是否包含某个子串，使用 `assign` 定义变量来避免重复计算。同时，我们使用了三目运算符 `?` 简化了代码，使得整个代码更加简洁易懂。

<StatisticCard.Group direction="row"> <StatisticCard statistic={{ title: '订单编号', value: detailData?.orderUuid || '-', groupSeparator: '' }} /> <StatisticCard.Divider type="vertical" /> <StatisticCard statistic={{ title: '下单时间', value: detailData?.createTime || '-' }} /> <StatisticCard.Divider type="vertical" /> <StatisticCard statistic={{ title: '订单状态', value: DDZT_ENUM?.[detailData?.orderStatus]?.text || '-', suffix: detailData?.orderType ? ( <span style={{ color: 'red', fontSize: 14 }}> （{DDLX_ENUM?.[detailData?.orderType]?.text}） </span> ) : null }} chart={ detailData?.orderStatus === '2' ? ( <Button style={{ marginTop: 10 }}>发货</Button> ) : detailData?.orderStatus === '3' ? ( <span style={{ fontSize: 13 }}>7天内不确认收货，系统自动收货</span> ) : null } chartPlacement="right" /> </StatisticCard.Group>解释代码，怎么修改样式为竖列，订单状态显示不同的图片根据状态

这段代码使用了 Ant Design 的 StatisticCard 组件，其中包含了三个 StatisticCard 组件，每个组件分别显示了订单编号、下单时间和订单状态等信息。这三个组件通过 StatisticCard.Group 组件进行了横向排列，同时使用了 StatisticCard.Divider 组件进行了分隔。

如果要修改样式为竖列，只需要将 StatisticCard.Group 的 direction 属性设置为 "column" 即可，如下所示：

<StatisticCard.Group direction="column">
  ...
</StatisticCard.Group>

如果要根据订单状态显示不同的图片，可以在 StatisticCard 的 value 属性中使用 JSX 语法，根据订单状态动态渲染不同的图片，例如：

<StatisticCard
  statistic={{
    title: '订单状态',
    value: (
      <>
        {detailData?.orderStatus === '1' && <img src="待付款图片" />}
        {detailData?.orderStatus === '2' && <img src="待发货图片" />}
        {detailData?.orderStatus === '3' && <img src="待收货图片" />}
        {detailData?.orderStatus === '4' && <img src="已完成图片" />}
      </>
    ),
    suffix: detailData?.orderType ? (
      <span style={{ color: 'red', fontSize: 14 }}>
        （{DDLX_ENUM?.[detailData?.orderType]?.text}）
      </span>
    ) : null
  }}
  chart={
    detailData?.orderStatus === '2' ? (
      <Button style={{ marginTop: 10 }}>发货</Button>
    ) : detailData?.orderStatus === '3' ? (
      <span style={{ fontSize: 13 }}>7天内不确认收货，系统自动收货</span>
    ) : null
  }
  chartPlacement="right"
/>

在 value 属性中，使用了一个 React.Fragment 来包裹多个图片，并根据订单状态动态渲染对应的图片。同时，suffix 属性的用法和之前保持一致，不受影响。