- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
为工作构建一个聊天站点(自动响应),并且在可缩放渲染中设置按钮/段落对的状态有困难。
ID
是用JSON
写的,所以不是唯一创建Active=
和 value=
也来自相同的 JSON
。
我想做的:我希望能够单击按钮并将具有相同 ID
的段落中的文本复制到剪贴板。
代码(相关片段):
export default class MenuExamplePointing extends Component {
state = { activeItem: 'Transfer list' } // functioning setState for MENU-select
value = { activeItem: '1'} // functioning setState for MENU-select
valuetwo = { activeId: '1'} // non-functioning setState for BUTTON/P
Wtest(state){
const { activeId } = this.valuetwo
if (state.value === "1"){
return(
<div className="contentHolder">
{PostData.map((postDetail) => {
return <div>
<button
value= {postDetail.value}
className="descriptive"
active={activeId === postDetail.value.toString()}
id={postDetail.value}
//onClick={this.handleIdClick}
//onClick={() => this.handleIdClick }
>
{postDetail.name}
</button>
<p
active={activeId === postDetail.value}
id={postDetail.value}
value={postDetail.value}
className="insertText" >
{postDetail.content}
</p>
</div>
})}
</div>
)
}
handleIdClick = (e, { value }) => {
this.setState({ activeId: value })};
handleItemClick = (e, { name, value }) => {
this.setState({ activeItem: name, value })};
render() {
const { activeItem } = this.state
return (
<div>
<Menu pointing>
<Menu.Item
name='Transfer List'
active={activeItem === 'Transfer List'}
onClick={this.handleItemClick}
value = "1"
/>
....
<segment>
<div>{this.Wtest(this.state)}</div>
</segment>
最佳答案
通过选择 currentTarget.value 并从按钮中删除 id,我能够为每个生成的输入获取值并操作其 innerHTML (copyToClipboard)。因此,即使我没有正确回答我的问题,我也找到了一个合适且可扩展的解决方案。有兴趣的,这里是新代码:
bar(e){
var equals = e.currentTarget.value;
document.getElementById(equals).innerHTML = "test";
}
Wtest(state){
if (state.value === "1")
return(
<div className="contentHolder">
{PostData.map((postDetail) => {
return <div>
<button
value={postDetail.value.toString()}
className="descriptive"
onClick={this.bar}
>{postDetail.name}
</button>
<p
id={postDetail.value}
value={postDetail.value.toString()}
className="insertText" >
{postDetail.content}
</p>
</div>
})}
</div>
)
}
关于javascript - React Javascript - setState 问题和 copyToClipboard 问题与可缩放按钮 + p 渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58397711/
我使用下面的 JavaScript 从网页上的所有(多个)code 元素复制文本: Copy all code Copy TEXT 1 function copyToClipboard(elemen
我一直在使用这个小makro for excel,直到它突然停止工作(我没有改变任何东西,除了办公室更新): Sub SumToClipboard() If TypeName(Selection)
我有一个 PHP 脚本,它将打印出项目列表。我想在那里添加一个按钮,将列表中的一个或多个项目复制到剪贴板。我发现了一个基本的 Javascript 函数,看起来运行良好。 但是,如果我得到超过 2 行
我有以下脚本,它从表格中复制一个单元格数据(该单元格是隐藏的 - JS 获取数据,show 必须暂时显示它);它工作得很好,但只对“bbcode2”ID 和任何行上的“onclick="CopyToC
之前在调用 VirtualStringGrid -> CopyToClipBoard 之后,我可以在记事本中将网格粘贴为选项卡式文本,或者在粘贴到 Excel 或 Outlook 中时将其粘贴为完全格
为工作构建一个聊天站点(自动响应),并且在可缩放渲染中设置按钮/段落对的状态有困难。 ID是用JSON写的,所以不是唯一创建Active= 和 value= 也来自相同的 JSON。 我想做的:我希望
我是一名优秀的程序员,十分优秀!