Disable to update checkbox on Viewer Component

[Procrustes5]

Describe the issue

Thank you for developing library.

It's natural that we can't change the data in the Viewer component because it has the Readonly attribute, but I thought it would be nice if clicking the check box for the markdown is available.

I'd like to hear your opinions.

Procedure version

4.15.6

Reproduction link

No response

[imzbf]

This is a useful feature, and I need to find time to test whether it's technically feasible.

[imzbf]

I've released the feature in the beta version, have a try.

npm i md-editor-v3@beta

import { config } from 'md-editor-v3';

config({
  markdownItPlugins(plugins) {
    return plugins.map((item) => {
      if (item.type === 'taskList') {
        return {
          ...item,
          options: {
            ...item.options,
            enabled: true
          }
        };
      }

      return item;
    });
  }
});

[Procrustes5]

@imzbf looks so good! gratitude to respond.

[bintheext]

I've released the feature in the beta version, have a try.

我已经发布了测试版的特征，试试看。

npm i md-editor-v3@beta

import { config } from 'md-editor-v3';

config({
  markdownItPlugins(plugins) {
    return plugins.map((item) => {
      if (item.type === 'taskList') {
        return {
          ...item,
          options: {
            ...item.options,
            enabled: true
          }
        };
      }

      return item;
    });
  }
});

我尝试了这个方法，现在它可以进行点击/取消，但是在vite构建的vuetify项目环境下，编辑区域没有同步，选中/取消选中操作，文本编辑器内容都没有发生改变，这可能是个bug

[imzbf]

4.18.0版本试过了吗

[bintheext]

4.18.0版本试过了吗 用的是 "md-editor-v3": "^4.18.0-4",

[imzbf]

我创建的基础项目无法还原你描述的问题，无论实在App.vue还是新增的路由下的组件中。需要你给一个必现的demo

[bintheext]

我创建的基础项目无法还原你描述的问题，无论实在App.vue还是新增的路由下的组件中。需要你给一个必现的demo

我知道了，跟你的组件无关，我重新构造新项目，就又正常了，问题已解决。感谢

[bintheext]

I've released the feature in the beta version, have a try.

npm i md-editor-v3@beta

import { config } from 'md-editor-v3';

config({
  markdownItPlugins(plugins) {
    return plugins.map((item) => {
      if (item.type === 'taskList') {
        return {
          ...item,
          options: {
            ...item.options,
            enabled: true
          }
        };
      }

      return item;
    });
  }
});

请问如何将下面两个config组合起来使用呢？假如分开设置，第一个会被后面一个覆盖掉

// 锚点
config({
  markdownItPlugins(plugins) {
    return [
      ...plugins,
      {
        type: 'mark',
        plugin: MarkExtension,
        options: {}
      },
      {
        type: 'linkAttr',
        plugin: LinkAttr,
        options: {
          matcher(href: string) {
            return !href.startsWith('#');
          },
          attrs: {
            target: '_blank'
          }
        }
      },
      {
        type: 'anchor',
        plugin: Anchor,
        options: {
          // permalink: true,
          permalink: Anchor.permalink.headerLink(),
          // permalinkSymbol: '#',
          // permalinkBefore: false,
          // permalinkSpace: false,
          slugify(s: string) {
            return s;
          }
        }
      }
    ];
  },
  codeMirrorExtensions(theme, extensions) {
    // _exs[1] = basicSetup;
    return [...extensions, lineNumbers()];
  },
});

// 任务列表勾选
config({
    markdownItPlugins(plugins) {
      return plugins.map((item) => {
        if (item.type === 'taskList') {
          return {
            ...item,
            options: {
              ...item.options,
              enabled: true
            }
          };
        }
        return item;
      });
    },
  }
)

[bintheext]

I've released the feature in the beta version, have a try.

npm i md-editor-v3@beta

import { config } from 'md-editor-v3';

config({
  markdownItPlugins(plugins) {
    return plugins.map((item) => {
      if (item.type === 'taskList') {
        return {
          ...item,
          options: {
            ...item.options,
            enabled: true
          }
        };
      }

      return item;
    });
  }
});

请问如何将下面两个config组合起来使用呢？假如分开设置，第一个会被后面一个覆盖掉

// 锚点
config({
  markdownItPlugins(plugins) {
    return [
      ...plugins,
      {
        type: 'mark',
        plugin: MarkExtension,
        options: {}
      },
      {
        type: 'linkAttr',
        plugin: LinkAttr,
        options: {
          matcher(href: string) {
            return !href.startsWith('#');
          },
          attrs: {
            target: '_blank'
          }
        }
      },
      {
        type: 'anchor',
        plugin: Anchor,
        options: {
          // permalink: true,
          permalink: Anchor.permalink.headerLink(),
          // permalinkSymbol: '#',
          // permalinkBefore: false,
          // permalinkSpace: false,
          slugify(s: string) {
            return s;
          }
        }
      }
    ];
  },
  codeMirrorExtensions(theme, extensions) {
    // _exs[1] = basicSetup;
    return [...extensions, lineNumbers()];
  },
});

// 任务列表勾选
config({
    markdownItPlugins(plugins) {
      return plugins.map((item) => {
        if (item.type === 'taskList') {
          return {
            ...item,
            options: {
              ...item.options,
              enabled: true
            }
          };
        }
        return item;
      });
    },
  }
)

我知道了，在结构体里面构造好就可以了