时间戳

首页 > 解决方案 > 如何为按钮分配不同的值取决于在反应中单击的按钮

reactjs - 如何为按钮分配不同的值取决于在反应中单击的按钮

问题描述

我正在创建一个响应组件，用户应该在六个不同的按钮之间进行选择，然后当您检查按钮时，您可以按下下一个按钮。我看过一些带有单选按钮的教程，但不是普通按钮。这是原型： https ://preview.uxpin.com/7fb204007fc97420378cd5c8e987a91e9a28d1bf#/pages/122748926?mode=i 任何提示或帮助链接？

标签： reactjsfrontend

解决方案

Tried this, but it doesn't seems to work for me.

let ratingValue = [{ val: 1 }, { val: 2 }, { val: 3 }, { val: 4 }, { val: 5 }, { val: 6 }];

class Scale extends Component {
  constructor(props) {
    super(props);
    this.handleButtonClicked = this.handleButtonClicked.bind(this);
  }

  handleButtonClicked(buttonNumber, buttonValue) {
    console.log("User Pressed " + buttonNumber + "with Rating of " + buttonValue);
  }

  render() {
    let buttonsMap = ratingValue.map((button, index) => {
      return (
        <button key={index} onClick={this.handleButtonClicked(index, button.val)}>
          {button.val}
        </button>
      );
    });
    return <div>{buttonsMap}</div>;

推荐阅读