Ant-Design React-Native 搜索栏取消按钮在按下时无法隐藏

Question

我试图让搜索栏右侧的取消按钮在按下时隐藏。我尝试使用 showCancelButton 道具，但它不起作用。 Ant-Design React-Native Docs Link

这是问题复制回购https://github.com/kvnlee777/antd-rn-issue的链接

react-native 版本 0.61.4

ios 模拟器版本 12.4

import React, {useState} from 'react';
import { Alert, View} from 'react-native';
import { SearchBar } from '@ant-design/react-native';


const SearchBarDemo = () => {
  const [value, setValue] = useState('');    
  const [showCancel, setShowCancel] = useState(true);

  const onChange = (currentValue) => {
    setValue(currentValue);
  }

  const clear = () => {
    setValue('');        
    setShowCancel(false);
  }

  return (
    <View style={{ marginTop: 30}}>           
      <SearchBar			
        value={value}
        placeholder="Search products, brands"
        onSubmit={value => Alert.alert(value)}              
        onCancel={clear}
        onChange={onChange}                  
        cancelText='Cancel'
        showCancelButton={showCancel}        
      />
    </View>
  );


};
export default SearchBarDemo;

Answer 1

您正在使用字符串来表示真假。字符串 'false' 的计算结果为 true。

将'true' 和'false' 替换为true 和false，它应该可以工作