小编And*_*son的帖子

我使用类似于在codesandbox中找到的react-dnd可排序示例的代码，使用react-dnd创建了一个简单的可排序列表。

然而，我在尝试概念化如何调整这个示例并利用react-dnd的自定义拖动层来自定义拖动预览时遇到了一些困难。具体来说，我想在开始拖动组件后更改其背景颜色。没什么太复杂的。

为什么需要使用自定义拖动层？因为由于浏览器 API 和 React-dnd 的 HTML5 后端（这就是我正在使用的）的限制，我无法使用 CSS 设置拖动预览的样式。

我无法在可排序列表中找到任何使用自定义拖动层的示例，因此我们将不胜感激。

我有一个 textarea，我希望用户能够在其中输入文本。 textarea 中的每个新行最终都会被拆分并发送回数据库以在其他地方使用。为了从用户的角度显示这一点，我想为他们在 textarea 中输入的每个新行添加一个项目符号。

我已经把这个工作到了当你按下回车键并在 textarea 内容的最后一行时它成功添加一个项目符号的程度

<textarea onInput="handleInput(event)" rows="10"></textarea>

let previousLength = 0;

const handleInput = (event) => {
    const bullet = "\u2022";
    const newLength = event.target.value.length;
    const characterCode = event.target.value.substr(-1).charCodeAt(0);

    if (newLength > previousLength) {
        if (characterCode === 10) {
            event.target.value = `${event.target.value}${bullet} `;
        } else if (newLength === 1) {
            event.target.value = `${bullet} ${event.target.value}`;
        }
    }

    previousLength = newLength;
}

https://codepen.io/andrewgarrison/pen/vqqmMv?editors=1010

但是，当您位于 textarea 内容的中间并按 Enter 时，我还希望它添加一个项目符号。现在它只是添加了一个没有项目符号的新行。