首页 > 解决方案 > 从我的 api 呈现值的问题

问题描述

我需要渲染从我的 api 获得的 maxoffer,但是当我尝试渲染它说未定义的值时,如何在第一次尝试时渲染它?

这是我的代码

const [vPayrollBureauMaxOffer, setvPayrollBureauMaxOffer] = useState();
const [vPayrollAmount, setvPayrollAmount] = useState(vPayrollBureauMaxOffer);

useEffect(() => {
  let isUnmount = false
  async function Request() {
    const {data} = await ForceApi.post(`/someapi.php`);
    setvPayrollBureauMaxOffer(data.vPayrollBureauMaxOffer);
  }
  Request();
  return () => {
    setisLoading(false);
    isUnmount = true
  }
}, []);

return (
 <View style={styles.inputContainer2}>
   <Text style={styles.inputs2}>$</Text>
    <TextInput
      style={styles.inputs}
      placeholder={`${vPayrollAmount}`}
      placeholderTextColor={theme.SECONDARY_TEXT_COLOR}
      keyboardType={'numeric'}
      underlineColorAndroid="transparent"
      autoCorrect={false}
      autoCapitalize="characters"
      value= {`${vPayrollAmount}`}
      onChangeText={setvPayrollAmount}
      />
     </View>
   ); 

标签: reactjsreact-native

解决方案


好的,我注意到您的代码中有一些内容。第一件事是你没有为你的第一个初始状态设置值,所以我将它设置为一个空字符串其次你的vPayrollAmount值不会随着变化而自动更新,vPayrollBureauMaxOffer所以没有必要按照你现在的方式设置它。只是让它空

const [vPayrollBureauMaxOffer, setvPayrollBureauMaxOffer] = useState('');
const [vPayrollAmount, setvPayrollAmount] = useState('');

接下来,您应该设置另一个 useEffect 来监听vPayrollBureauMaxOffer值的变化以更新vPayrollAmount

useEffect(() => {
  setvPayrollAmount(vPayrollBureauMaxOffer)
}, [vPayrollBureauMaxOffer]);

推荐阅读