React js如何在单击文本区域后添加“按钮值”

Question

我创建了一个带有textarea的页面。 我也创建了台式机键盘。 我想在一个字符（此键盘）上单击后将一个字符添加到textarea。 如何在React中做到这一点？

Answer 1

看这个例子

np.split

动态字符呈现

 import React, { useState } from "react";
import "./styles.css";

export default function App() {
  const [textValue, setTextValue] = useState("");

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <textarea value={textValue} />
      <div className="buttons-box">
        <button onClick={() => setTextValue(`${textValue}A`)}>A</button>
        <button onClick={() => setTextValue(`${textValue}B`)}>B</button>
        <button onClick={() => setTextValue(`${textValue}C`)}>C</button>
        <button onClick={() => setTextValue(`${textValue}D`)}>D</button>
        <button onClick={() => setTextValue(`${textValue}E`)}>E</button>
        <button onClick={() => setTextValue("")}>Clear</button>
      </div>
    </div>
  );
}

这很重要：

• getElements可以是从外部API获取内容的功能。
• 安装组件时的setElements。
• 保证elements数组具有标签和value属性，并且该值始终用作唯一值，因为它用作按钮的键。