HarryChen0506 / react-markdown-editor-lite

a light-weight Markdown editor based on React. 一款轻量的基于React的markdown编辑器
https://harrychen0506.github.io/react-markdown-editor-lite/
MIT License
1.03k stars 160 forks source link

[BUG] #303

Closed mahasrc closed 3 months ago

mahasrc commented 4 months ago

Please note 提问前请注意

Your environment

For example, Windows 10, Chrome 80.0. 例如:Windows 10,Chrome 80.0

Description

For example, click a button, input some text, and something went wrong. 例如:点击某个按钮,输入某些文本,然后发现问题。

Reproduction URL

Please make a minimal reproduction with codesandbox. If your bug involves a build setup, please create a project using create-react-app and provide the link to a GitHub repository. 请使用codesandbox建立一个最小复现。 如果您遇到的错误涉及构建设置,请使用create-react-app创建一个项目,并提供GitHub仓库链接。

How to set the URL for image markdown dynamically?

When the user click on Image icon, I want to,

But it is not updating the dynamic URL in the editor.

Image markdown is displayed without URL.

 const handleFileUpload = async (file: File) => {
    const response = await dispatch(uploadFile(file))
    const markdown = `![${file.name}](${response.payload})`
    console.log('Markdown', markdown)
    setValue('content', markdown)
    setContent(markdown)
  }

 <Controller
              name='content'
              control={control}
              render={({ field: { value, onChange } }) => (
                <MdEditor
                  value={value}
                  style={{ height: '500px' }}
                  renderHTML={text => mdParser.render(text)}
                  onChange={({ text }) => {
                    onChange(text)
                    handleEditorChange({ text })
                  }}
                  onImageUpload={handleFileUpload}
                />
              )}
            ></Controller>