Làm thế nào để thiết lập state với dynamic key name?

Để thiết lập state trong React với dynamic key name, bạn có thể sử dụng cú pháp tính toán tên thuộc tính (computed property names) trong ES6. Điều này cho phép bạn đặt tên key cho state dựa trên giá trị của một biến. Dưới đây là cách bạn có thể làm điều đó:

Sử dụng useState Hook trong Functional Component

Nếu bạn đang sử dụng functional component, bạn có thể sử dụng useState hook để thiết lập state. Để cập nhật state với dynamic key, bạn có thể sử dụng một hàm cập nhật state và truyền vào một object với key được tính toán:

import React, { useState } from 'react';

function MyComponent() {
  const [state, setState] = useState({});

  function updateState(key, value) {
    setState(prevState => ({
      ...prevState,
      [key]: value
    }));
  }

  // Giả sử bạn muốn cập nhật state với key là giá trị của biến `dynamicKey`
  const dynamicKey = 'myKey';
  const value = 'myValue';

  // Cập nhật state
  updateState(dynamicKey, value);

...