javascript - 单击另一个可触摸不透明度并将其中的文本设置为文本输入中输入的值时，如何制作可触摸不透明度

Question

我是一个 13 岁的初学者反应原生，我需要帮助解决标题中的问题。

我需要通过可触摸的不透明度点击来完成这一切。我曾尝试在谷歌上搜索其他解决方案，但一无所获。

其实就是一个教程Youtube。

这是链接：教程

请帮我。

谢谢你。

import React, { useState } from 'react';
import { StyleSheet, Text, View, FlatList, TextInput, TouchableOpacity } from 'react-native';
import Header from './components/header';
import TodoItem from './components/todoItem';

export default function App() {
  const [todos, setTodos] = useState([
    { text: 'turn on laptop', key: '1'},
    { text: 'create an app', key: '2'},
    { text: 'play on the switch', key: '3'}
  ]);

  const addToDo = () => {
    
  }

const PressHandler = (key) => {
    setTodos((prevTodos) => {
      return prevTodos.filter(todo => todo.key != key);
    });
}


  return (
    <View style={styles.container}>
      <Header />
      <View style={styles.content}>
        {/* todo form */}
        <View style={styles.list}>
          <FlatList 
            data={todos}
            renderItem={({ item }) => (
              <TodoItem item={item} PressHandler={PressHandler}/>
            )}
          />
        </View>
      </View>
        <TextInput style={styles.todoInput} maxLength={20} onChange={() => this.setState} />
        <TouchableOpacity style={styles.submitTodo} onPress={addToDo}>
          <Text style={styles.submitTodoText}>Done</Text>
        </TouchableOpacity>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1, 
    backgroundColor: "#fff",
  },
  content: {
    padding: 40,
  },
  todoInput: {
    position: "absolute",
    bottom: 1, 
  },
  todoInput: {
    height: 31,
    borderColor: "coral",
    borderStyle: "dashed",
    borderWidth: 1,
    borderRadius: 10,
    position: "absolute",
    bottom: 26,
    width: "73%",
    textAlign: "center",
    marginLeft: 25,
  },
  submitTodo: {
    padding: 10,
    width: "15%",
    position: "absolute",
    right: 15,
    bottom: 26,
    backgroundColor: "coral",
    borderRadius: 10,
    alignItems: "center",
  },
  submitTodoText: {
    color: "#fff",
    fontSize: 10,
  }
});

再次感谢您花时间在这上面。

标签： javascriptreact-native