#react-native
#react-native
Вопрос:
Мы с другом разрабатываем приложение, и мы застряли на проблеме… Мы хотим спросить имена некоторых игроков. Мы нажимаем на кнопку, чтобы добавить некоторый текстовый ввод. (Здесь все в порядке) Но теперь мы хотим вернуть тексты, которые мы ввели.
Я пытался сохранить их в состоянии, но я знаю, как это сделать с одним текстом, но не со многими.
addTextInput = (key) => {
let textInput = this.state.textInput;
if (textInput.length < 10) {
*textInput.push(<TextInput style={{ height: 40, borderColor: 'black', borderWidth: 2 }} key={key}
onChangeText={(text) => this.setState({ nomJoueur: text })}
/>);*
Data.addNombreJoueur();
console.log(nombreJoueurs);
}
this.setState({ textInput })
}
Я попробовал это, чтобы :
addTextInput = (key) => {
let textInput = this.state.textInput;
let nomJoueur = this.state.nomJoueur;
if (textInput.length < 10) {
textInput.push(<TextInput style={{ height: 40, borderColor: 'black', borderWidth: 2 }} key={key}
onChangeText={
(text) => nomJoueur.push(text)
}
nomParticipants2={this.state.nomJoueur}
/>);
Data.addNombreJoueur();
console.log(nombreJoueurs);
}
this.setState({ textInput })
}
Но при этом я получаю
"nomParticipants2": Array [
[23:17:16] "z",
[23:17:16] "ze",
[23:17:16] "zed",
[23:17:16] "zedz",
[23:17:16] "zedzx",
[23:17:16] "zedzxz",
[23:17:16] "zedzxzx",
[23:17:16] "r",
[23:17:16] "rz",
[23:17:16] "rze",
[23:17:16] "rzez",
[23:17:16] "rzezd",
[23:17:16] "e",
[23:17:16] "ez",
[23:17:16] "ezc",
[23:17:16] "ezcz",
[23:17:16] "ezczc",
[23:17:16] ],
Мне действительно нужна ваша помощь!
Спасибо, ребята
РЕДАКТИРОВАТЬ: Спасибо Nerdragen за вашу помощь
Чтобы решить мою проблему, у меня есть n разных функций для добавления inputText :
addTextInput = (key) => {
console.log('Bonjour');
let textInput = this.state.textInput;
let nomJoueur0 = this.state.nomJoueur0;
let nomJoueur1 = this.state.nomJoueur1;
let nomJoueur2 = this.state.nomJoueur2;
let nomJoueur3 = this.state.nomJoueur3;
...
if (textInput.length == 0) {
textInput.push(<TextInput style={{ height: 40, borderColor: 'black', borderWidth: 2 }} key={key}
onChangeText={(text) => this.setState({ nomJoueur0: text })
}/>);
Data.addNombreJoueur();
console.log(nombreJoueurs);
}
else if (textInput.length == 1) {
textInput.push(<TextInput style={{ height: 40, borderColor: 'black', borderWidth: 2 }} key={key}
onChangeText={(text) => this.setState({ nomJoueur1: text })
}/>);
Data.addNombreJoueur();
console.log(nombreJoueurs);
}
...
Ответ №1:
Если у вас всего несколько TextInput и вы не возражаете против создания дополнительных функций, вы всегда можете просто создать отдельную функцию для каждого компонента. Более чистое решение — изменить ваш текущий onChangeText
на onChangeText={значение=> this.setState({значение})}, где значение — это имя переменной в состоянии. Итак, используя приведенный выше фрагмент, если вы изменили значение на username
, то this.state.username
оно будет обновлено.
Комментарии:
1. Во-первых, спасибо за ваш ответ. На самом деле, я не могу создать отдельную функцию для каждого компонента, потому что компоненты создаются с помощью другой функции (а если и могу, то не знаю как). И то, что вы предлагаете, работает, но только для последнего слова. Это работает не для всех из них. Я не знаю, как сохранить их в разных переменных, но с одинаковым именем. (Вы понимаете, что я имею в виду?)
2. Если я правильно понимаю, что вы хотите, вы хотите, чтобы несколько входных данных отображались в одну переменную. Это настоятельно не рекомендуется, поскольку входные данные будут сбрасывать переменную при каждом изменении. Чтобы обойти эту проблему, вам придется установить эту переменную в виде массива и заставить каждый ввод помещать значение в этот массив.
3. Это именно то, чего я хочу. Но, как вы говорите, при каждом изменении происходит обновление, затем все сохраняется (см. последний код: Nomparticipants 2). Я не знаю, как получить только последнее обновление для каждого ввода.
4. Вы не можете. Невозможно получить только последний ввод, не зная предыдущих вводов. Иначе, как это может быть последним вводом? Здесь есть 2 решения, которые я могу придумать. 1. использовать массив и помещать каждый отдельный ввод в отдельный индекс массива, затем просто получить конечный массив. Но это беспорядочно. 2, поскольку вы пытаетесь получить только name, вы знаете, что входные данные должны быть в алфавитном порядке. Вы можете заставить один ввод принимать только буквы и запятые и заставить пользователя использовать запятые для разделения имен, а затем просто разбить строку на массив имен.