react-native - 如何使用 React Native 在 TextInput 值中连接数字代码和字符串

Question

有两个变量。

this.state={Amount=50, CurrencySymbol="₹"}

文本输入渲染

<TextInput value={this.state.CurrencySymbol + " " + this.state.Amount.toString()} editable={false}></TextInput>

但货币符号未显示。

有没有办法在 TextInput 中动态打印货币符号

Answer 1

您以错误的方式分配状态值。这应该是这样的：

this.state = {
  Amount: 50,
  CurrencySymbol: "\u0024"
}

• \u20B9用于卢比。
• \u0024用于美元。

在你们的州里没有命名TAmount的州。你写this.state.TAmount.toString()的。应该是this.state.Amount.toString()。

<TextInput value={this.state.CurrencySymbol + " " + this.state.Amount.toString()} editable={false}></TextInput>

更新

由于您有HTML货币符号，因此您可以通过这种方式将其保存到您的状态中：

this.state = {
  Amount: 50,
  CurrencySymbol: "₹",
  CurrencySymbols: {
    "₹": "\u20B9",
    "€": "\u20AC",
    "$": "\u0024"
  }
}

// Then use it on like this
<TextInput value={this.state.CurrencySymbols[this.state.CurrencySymbol] + " " + this.state.Amount.toString()} editable={false}></TextInput>

我猜这可能是您解决问题的最简单方法。

除了HTML在react-native-webview.

就是这样。

Answer 2

不推荐使用您正在使用的状态，您应该使用useState()钩子来定义状态及其设置器函数。

更新这个

import React,{ useState } from 'react';

//Set State Variables

const [amount,setAmount] = useState(50);
const [currencySymbol,setcurrencySymbol] = useState("₹");

//Set value of text input to your state variable values

<TextInput value={currencySymbol + amount.toString()} editable={false} />