小编Kau*_*Zaw的帖子

我正在尝试增加图例标签和图表之间的间距reactjs，我寻找了不同的解决方案，但大多数都是使用普通js。我已根据此答案将其添加到我的图表选项中

  const DoughnutOptions = {
    plugins: [
    {
      beforeInit: function (chart, options) {
        chart.legend.afterFit = function () {
          this.height = this.height + 50;
        };
      }
    },
      {
        labels: {
          render: "percentage",
          fontColor: ["black", "white"],
        },
      },
    ]
   }

  return (
         <Doughnut
            data={DoughnutData}
            options={DoughnutOptions}
          />
       )

但它不起作用，我在这里错过了什么吗？

通常，当我处理表单提交时，我使用useState输入值并将onChange事件设置为

const [inputValues, setInputValues] = useState({
    title: "",
    address: "init"
  });

  function submitHandler(e) {
    e.preventDefault();

    const meetupData = {
      meetupTitle: inputValues.title,
    };

    console.log(meetupData);
  }
  return (
    <form onSubmit={submitHandler}>
      <div>
        <label htmlFor="title">Meetup Title</label>
        <input
          type="text"
          required
          id="title"
          value={inputValues.title}
          onChange={(e) =>
            setInputValues({ ...inputValues, title: e.target.value })
          }
        />
      </div>
      <div>
        <button>Add Meetup</button>
      </div>
    </form>
  );

但在一些教程中我发现它是用useRefas编写的

const titleInputRef = useRef();

  function submitHandler(e) {
    e.preventDefault();
    const enteredTitle = titleInputRef.current.value;

    const meetupData = {
      title: enteredTitle,
    };

    console.log(meetupData); …

我有一个动态路由，我试图在 url 中显示标题并将id传递（隐藏）到我的动态路由并id在中使用getStaticProps. 我发现我无法在 nextjs 中轻松传递数据，就像我们过去使用 React Router 或其他客户端路由库传递数据一样。

我正在遵循这个答案，但是当我console.log(context.params)看不到id传递过来的内容时Link，我在这里做错了什么？

// index.js

      <Link
          href={{
            pathname: `/movie/[title]`,
            query: {
              id: movie.id, // pass the id 
            },
          }}
          as={`/movie/${movie.original_title}`}
        >
          <a>...</a>
      </Link>

// [movieId].js

export async function getStaticProps(context) {
  console.log(context.params); // return { movieId: 'Mortal Kombat' }

  return {
    props: { data: "" },
  };
}

React 表排序有 3 个条件，default view如其ascending官方descending示例https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/sorting所示

现在，我只想将其设置在ascending和之间descending并删除默认视图。我尝试默认对第一列进行排序

 useTable(
    {
      columns,
      data,
      initialState: {
        pageIndex: 0,
        pageSize: 10,
        sortBy: [
          {
            id: "asset",
            desc: false,
          },
        ],
      },
    },
  )

但当我单击该列时，默认视图仍然存在，但我不知道如何删除它。我在他们的文档中也找不到它。