如何将两个按钮合并为一个?

How to merge two buttons into one?

我有以下两个按钮,希望合并为一个。

    <div className="mt-8 mb-16">
      <button
        onClick={handlePurchase}
        type="button"
        // disabled='{this[id] <= 10}'
        className="inline-flex items-center px-16 py-3 border border-transparent text-base font-large elevation-15 rounded-md text-white bg-green-600
           hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500"
      >
        Mint me a Marköbot!
      </button>
    </div>

    <div className="mt-8 mb-16">
      <button
        type="button"
        disabled='{this[id] <= 10}'
        className="inline-flex items-center px-16 py-3 border border-transparent text-base font-large elevation-15 rounded-md text-gray-500 bg-gray-300"
      >
        All Marköbot have been minted!
      </button>
    </div>

条件是this.id <=10。使用 ReactJS 和 TailWind。

这是我用来解决

上发布的问题的另一种方法

非常感谢advice/help!

马克卢斯

可以使用 JSX 回调来代替合并这两个按钮。请参阅

上其他帖子的解决方案

未定义的return来自回调。它需要在(在这种情况下)传递给按钮之前进行绑定。

查看建议的其他一些方法: