如何在react中替换 vue 的attrs对象(附代码)

164 阅读1分钟

在将我的vue应用程序迁移到react中时,我面临这个问题。我无法理解如何将这个属性引入到react中。

在我的vue图标组件中,有一个渲染函数来定义非属性。现在我不确定如何在react渲染函数中处理这个属性。

这里是vue图标组件--渲染函数

    render(h, { props, data, listeners, children = [] }) {
    // other code.......
    
    let iconName = props.icon || children.pop().text;
    let options = {
      class: [
        "my-icon",
        cType && "my-icon--" + cType,
        cColor && "my-icon--" + cColor,
        cSize && "my-icon--" + cSize,
        props.spacing && "my-icon--spacing",
      ],
      style: {
        fontSize: customSize,
      },
      on: listeners,
    };
    if (data.class) {
      if (Array.isArray(data.class)) {
        options.class = options.class.concat(data.class);
      }
      if (typeof data.class === "string" || typeof data.class === "object") {
        options.class.push(data.class);
      }
    }
    if (data.style) {
      options.style = Object.assign(data.style, options.style);
    }
    console.log(data);
    return h("i", Object.assign(data, options));
  },

在 "数据 "中,它返回{attrs**:{...}},其中包括(attrs:{}, class: ..., domProps: ..., on: ..., style: ...)。

如何在react中处理这个问题?任何建议都会有帮助,因为我对react不是很熟悉。