NervJS / taro

开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/
https://docs.taro.zone/
Other
35.46k stars 4.78k forks source link

taro 3.0.8版本使用WxParse报错 #7532

Closed alwaysRemember closed 3 years ago

alwaysRemember commented 4 years ago

相关平台

微信小程序

小程序基础库: 2.12.2 使用框架: React

复现步骤

npm run dev:weapp npm run mock

修改src/request/index.ts
第17行serverTestUrl为mockUrl,
第14行mockUrl参数为npm run mock 运行后的链接

期望结果

如何避免这种情况

实际结果

在3.0.8版本中要求Component继承自React本身,但是在使用Wxparse的时候需要调用到Taro.Component中的setData,这时候组件继承切换为Taro.Component就报错了。

ERROR:

Super expression must either be null or a function
TypeError: Super expression must either be null or a function

环境信息

Taro CLI 3.0.8 environment info:
    System:
      OS: macOS 10.15.5
      Shell: 5.7.1 - /bin/zsh
    Binaries:
      Node: 10.15.3 - /usr/local/bin/node
      Yarn: 1.22.4 - /usr/local/bin/yarn
      npm: 6.4.1 - /usr/local/bin/npm
    npmPackages:
      @tarojs/components: 3.0.8 => 3.0.8 
      @tarojs/mini-runner: 3.0.8 => 3.0.8 
      @tarojs/react: 3.0.8 => 3.0.8 
      @tarojs/runtime: 3.0.8 => 3.0.8 
      @tarojs/taro: 3.0.8 => 3.0.8 
      @tarojs/webpack-runner: 3.0.8 => 3.0.8 
      babel-preset-taro: 3.0.8 => 3.0.8 
      eslint-config-taro: 3.0.8 => 3.0.8 
      react: ^16.10.0 => 16.13.1 
      taro-ui: ^3.0.0-alpha.3 => 3.0.0-alpha.3 
    npmGlobalPackages:
      typescript: 3.1.6
Chen-jj commented 4 years ago

https://nervjs.github.io/taro/docs/next/html

alwaysRemember commented 4 years ago

https://nervjs.github.io/taro/docs/next/html

之前尝试过这个方法 但是他的传参只能显示初始数据 所以我才切换为wxparse

sooboy commented 4 years ago

在3.0.8版本中要求Component继承自React本身后, 像 this.$scope.selectComponent 这样的方法没法办啊,大家有没有解决方案

alwaysRemember commented 4 years ago

在3.0.8版本中要求Component继承自React本身后, 像 this.$scope.selectComponent 这样的方法没法办啊,大家有没有解决方案

可以直接使用: dangerouslySetInnerHTML属性进行渲染。 https://taro-docs.jd.com/taro/docs/html 但是这个属性目前只支持固定的参数渲染,不支持从请求中获取的数据。 所以需要写成:

const [isShow, setIsShow] = useState<boolean>(false);
  useEffect(() => {
    setIsShow(!!data);
  }, [data]);
  return (
    <View className={styles['product-content-wrapper']}>
      {(isShow && (
        <View
          className="taro_html"
          dangerouslySetInnerHTML={{ __html: data }}
        />
      )) ||
        ''}
    </View>
  );

这个样子可以实现渲染HTML,并且支持请求的数据。

alwaysRemember commented 4 years ago

在3.0.8版本中要求Component继承自React本身后, 像 this.$scope.selectComponent 这样的方法没法办啊,大家有没有解决方案

可以直接使用: dangerouslySetInnerHTML属性进行渲染。 https://taro-docs.jd.com/taro/docs/html 但是这个属性目前只支持固定的参数渲染,不支持从请求中获取的数据。 所以需要写成:

const [isShow, setIsShow] = useState<boolean>(false);
  useEffect(() => {
    setIsShow(!!data);
  }, [data]);
  return (
    <View className={styles['product-content-wrapper']}>
      {(isShow && (
        <View
          className="taro_html"
          dangerouslySetInnerHTML={{ __html: data }}
        />
      )) ||
        ''}
    </View>
  );

这个样子可以实现渲染HTML,并且支持请求的数据。

dangerouslySetInnerHTML 渲染问题ISSUES: https://github.com/NervJS/taro/issues/7524