javascript - 从字符串转换为数组 react native

Question

我从 api [10, 20, 22, 26] 获取此字符串。这些值被分配给 [A, B, C, D]，我有一个具有这些值 [1, 2, 3 ,4] 的 slider 。 我需要的是，当您在 slider 中选择 1 时，它会给出 A 的值(在本例中为 10)。如果您在 slider 中选择 2，它应该为您提供 B 的值(即 20)，依此类推。 当我模拟数据时我可以这样做 const valueFromApi = [ 10,20, 22]; 但我不能对我的 api 中的数据做同样的事情，我想这是因为它是一个字符串而不是一个数组。

这是我的代码

    const Calculadora = ({navigation}) => {
  const [sliderValue, setsliderValue] = useState();
  const [sliderValue2, setsliderValue2] = useState(A);
  const [A, setvA] = useState();
  const [B, setvB] = useState();
  const [C, setvC] = useState();
  const [D, setvD] = useState();
  const [pterms, setpterms] = useState([]);
  const valuesFromApi = [ 10,20, 22];
  const [value, setValue] = useState(valuesFromApi[0]);

这就是我从 api 获取数据的方式

useEffect(() => { 
    async function BCcontroller() {
       const vCreationUser = 6;
       const vSolicitudeId = 8;
       const { data } = await ForceApi.post(`/ConsultBCController.php`, {vSolicitudeId, vCreationUser});
            const values = data.terms;
            setpterms(data.terms);
            console.log(setpterms);
            const [termA, termB, termC, termD] = values.split(',');
            setvA(Number(termA));
            setvB(Number(termB));
            setvC(Number(termC));
            setvD(Number(termD));
    }
    BCcontroller();
}, []);

这是我的 slider

<View style={{alignItems: 'stretch', justifyContent: 'center' }}>
                        <Slider 
                            maximumValue={D > 0 ? 4: 3 }
                            minimumValue={1}
                            step={1}
                            value={pterms.indexOf(value)}
                            onValueChange={index => setValue(pterms[index])}
                        />
                        <View style={styles.plazos}>
                            <Text style={styles.plazo1}>{A} meses</Text>
                            <Text style={styles.plazo2}>{B} meses</Text>
                            <Text style={styles.plazo3}>{C} meses</Text>
                            {D > 0 ? <Text style={styles.plazo3}>{D} meses</Text>: null }
                        </View>
                        <Text style={styles.slideText}>Su credito por:  ${A}MXN</Text>
                        <Text style={styles.slideText}>Usted recibe:    ${A}MXN</Text>
                        <Text style={styles.slideText}>A un plazo de:  {sliderValue2} meses</Text>

                        <Text style={styles.PaymentText}>Su pago: ${A}.00 MXN</Text>
                    </View>

任何帮助者将不胜感激

Answer 1

在我看来，您正在尝试在数据到达之前使用数据，您会使用以下内容吗:

useEffect(() => { 
       const    vCreationUser = 6,
                vSolicitudeId = 8
       ForceApi.post(`/ConsultBCController.php`, {vSolicitudeId, vCreationUser}).then(data => {
            const   values = data.terms,
                    [termA, termB, termC, termD] = values
            setpterms(values)
            setvA(Number(termA))
            setvB(Number(termB))
            setvC(Number(termC))
            setvD(Number(termD))
       })
    }, [])

如果您的 API 响应结构不正确，您可以将其与 JSON.parse() 结合使用:

const   values = JSON.parse(data.terms),