亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在 Ant Design pro 表中動態更改按鈕顏色

在 Ant Design pro 表中動態更改按鈕顏色

暮色呼如 2022-11-11 16:35:44
我正在使用 ant design pro 生成表格?,F在我想在一列中實現按鈕并根據值更改按鈕的顏色。但我正在努力如何實現這一點。和圖片類似。當為假時,我可以使用危險來創建一個紅色按鈕。但是如何根據單元格值禁用危險。我的代碼-->const columns = [{  title: 'News Reported',  dataIndex: 'newsReported',  hideInForm: true,  hideInSearch:true,  sorter: true,},{  title: 'Trustworthy',  dataIndex: 'trustworthy',  hideInForm: true,  sorter: true,  valueEnum: {    0: {      text: 'False',      status: 'False',    },    1: {      text: 'True',      status: 'True',    },  },  render: (_) => (      <Button        type="primary" danger        onClick={() => {          console.log("Option Clicked",_)        }}      >        {_}      </Button>  ),},]  return (<PageHeaderWrapper>  <ProTable    rowKey="key"    actionRef={actionRef}    request={(params, sorter, filter) => queryRule({ ...params, sorter, filter })}    columns={columns}    rowSelection={false}    scroll={{ x: 700 }}  /></PageHeaderWrapper>);如果我可以根據單元格值將危險設置為假,我可以實現我的目標。但是我該怎么做呢?提前致謝。
查看完整描述

2 回答

?
qq_笑_17

TA貢獻1818條經驗 獲得超7個贊

如果您的列值是布爾值,那么您可以使用以下內容:


render: (value) => (

  <Button

    type="primary" danger={value}

    onClick={() => {

      console.log("Option Clicked",_)

    }}

  >

    {value}

  </Button> ),


查看完整回答
反對 回復 2022-11-11
?
慕哥9229398

TA貢獻1877條經驗 獲得超6個贊

于是,發現了問題。當我使用值枚舉時,在渲染中傳遞參數時,它采用枚舉的文本值。發現渲染有另一個record具有行值的參數。使用它我可以獲得我想要的輸出。這是最好的方法嗎,我不知道。所以工作代碼現在適合我 -->


render: (_,record) => (

    <Button

      type="primary" danger={!record.status}

      onClick={() => {

        console.log("Option Clicked",_,record.status)

      }}

    >

      {_}

    </Button>

  ),


查看完整回答
反對 回復 2022-11-11
  • 2 回答
  • 0 關注
  • 689 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號