'Modify values of selected option ANTD

I want to choose "% Percent" as option, but the value on the select label want to be only "%", if I set value attribute, it doesn't change when select other option

Cell: (props) => {
  return (
    <Select
      labelInValue
      style={{ width: "120px", fontSize: "11.25px" }}
      bordered={false}
      // placeholder="Select a person"
      // defaultValue="%"
      // value={setBerArt === "P" ? "P" : "%"}
      onSelect={(value) => {
        console.log(value);
        setBerArt = value.label.split(" ");
        console.log(setBerArt[0]);
      }}
    >
      <Option className={styles.KondArt} value="% Prozentual">
        % Prozentual
      </Option>
      <Option className={styles.KondArt} value="P Pauschalbetrag " text="P">
        P Pauschalbetrag
      </Option>
    </Select>
  );
},


Solution 1:[1]

    Cell: (props) => {
  const [berArt, setBerArt] = useState("%");

  return (
    <Select
      labelInValue
      style={{ width: "120px", fontSize: "11.25px" }}
      bordered={false}
      defaultValue="% Prozentual"
      value={berArt}
      onSelect={(value) => {
        setBerArt(value.label.split(" ")[0]);
      }}
    >
      <Option className={styles.KondArt} value="% Prozentual">
        % Prozentual
      </Option>
      <Option className={styles.KondArt} value="P Pauschalbetrag " text="P">
        P Pauschalbetrag
      </Option>
    </Select>
  );
},

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Auron Bytyqi