reactmarkdown using remark-gfm plugin didn't render taskslist right

Question

this renders as:

Why.

 <Markdown
                rehypePlugins={[rehypeRaw, rehypeKatex] as any}
                remarkPlugins={[remarkMath, remarkGfm]}
                components={{
                  img: ({ node, ...props }) => (
                    <div style={{ display: "flex", justifyContent: "center" }}>
                      <img
                        style={{ maxWidth: "100%", borderRadius: "9px" }}
                        {...props}
                      />
                    </div>
                  ),
                }}
              >
                {articleGet.content}
              </Markdown>