Taro: onShareAppMessage在使用react-redux无法生效

[taajason]

相关平台

微信小程序

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

复现步骤

• taro官方react框架demo
• $ taro init myApp
• 在index.jsx文件中，加入onShareAppMessage函数

onShareAppMessage(options) {
    return {
      title: '测试分享',
      path: `/pages/index/index`,
      imageUrl: `https://***.jpg`,
      desc: '测试分享描述',
      success (res) {
        console.log('转发发布器已调起', res)
      },
      fail (e) {
        console.log('转发发布器调起失败', e)
      }
    }
  }

• 出现的结果是：页面未设置分享

• 如果把@connect整段内容去掉，重新编译后，则正常设置分享

• 在微信小程序、头条小程序均可以复现

期望结果

正常设置分享

实际结果

页面没有正常设置分享

环境信息

Taro CLI 3.0.5 environment info:
    System:
      OS: macOS 10.15.5
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 10.17.0 - ~/.nvm/versions/node/v10.17.0/bin/node
      Yarn: 1.19.1 - /usr/local/bin/yarn
      npm: 6.11.3 - ~/.nvm/versions/node/v10.17.0/bin/npm
    npmPackages:
      @tarojs/components: ^3.0.6 => 3.0.6 
      @tarojs/mini-runner: 3.0.5 => 3.0.5 
      @tarojs/react: 3.0.6 => 3.0.6 
      @tarojs/runtime: 3.0.6 => 3.0.6 
      @tarojs/taro: ^3.0.6 => 3.0.6 
      @tarojs/webpack-runner: 3.0.5 => 3.0.5 
      babel-preset-taro: 3.0.5 => 3.0.5 
      eslint-config-taro: 3.0.5 => 3.0.5 
      react: ^16.10.0 => 16.13.1 
      taro-ui: ^3.0.0-alpha.3 => 3.0.0-alpha.3 

[Chen-jj]

@taajason 暂时先在该页面的配置文件中，增加以下配置：

// page.config.js
{
  // ...
  enableShareAppMessage: true
}

[taajason]

@Chen-jj 谢谢，你的方案成功设置分享了
另外我也尝试了页面不用redux，把页面具体内容整个抽出成一个子组件，子组件中使用redux，不过部分业务逻辑实现，会多写一些代码，也是可行的，这里仅提供另外一个方向，当然上面的解决方案最方便了

[Chen-jj]

之后会在编译时分析，自动加上配置，那样应该能覆盖大部分情况

[onedayh]

加上enableShareAppMessage: true之后，是能分享了，但是分享设置的标题图片并没有生效

[Chen-jj]

@onedayh 新开一个 issue，附上 demo ，我们看看

[smackgg]

同问题，分享朋友圈 onShareTimeline 不会执行。config 中加上了 enableShareTimeline: true
去掉 connect 可以正常执行
代码片段（已经去掉 connect 的代码片段）:
页面
分享逻辑

补充：Taro 版本 3.0.9
@Chen-jj

[Chen-jj]

@smackgg 试了一下，复现不了。

import React, { Component } from 'react'
import { View } from '@tarojs/components'
import { connect } from 'react-redux'
import Taro from '@tarojs/taro'
import { add } from '../../actions/counter'

function withShare (opts) {
  return function demoComponent(WrappedComponent) {
    return class WithShare extends WrappedComponent {
      // 点击分享的那一刻会进行调用
      onShareAppMessage() {
        return {
          title: opts.title
        }
      }
    }
  }
}
@connect(
  ({ counter }) => ({ counter}),
  dispatch => ({
    add () {
      dispatch(add())
    }
  })
)
@withShare({
  title: 'eee'
})
class Index extends Component {
  // onShareAppMessage () {
  //   return {
  //     title: 'hi'
  //   }
  // }

  render () {
    return (
      <View className='index'>
        <View>{this.props.counter.num}</View>
        <View onClick={this.props.add}>add</View>
        <View onClick={() => Taro.navigateTo({ url: '/pages/detail/index' })}>navigate to</View>
      </View>
    )
  }
}

export default Index

export default {
  navigationBarTitleText: '首页',
  enableShareAppMessage: true
}

[Chen-jj]

3.1 会尝试先分析是否有调用分享 API，自动加上配置，这样能覆盖大部分情况。

但如分享 API 被封装在基类或自定义钩子中，还是需要手动加上配置。

[ly827]

设置了 enableShareAppMessage 触发分享 但是 useShareAppMessage 没起作用

[Chen-jj]

@ly827 扔个 demo 吧

[shide-L]

@Chen-jj connect 存在时分享朋友圈不能自定义内容 => onShareTimeline 不执行，注释connect之后没问题, demo

[hero-x]

enableShareAppMessage 这个可以 解决了我的问题 谢谢老板~

[Chen-jj]

@Chen-jj connect 存在时分享朋友圈不能自定义内容 => onShareTimeline 不执行，注释connect之后没问题, demo

配置一下 enableShareTimeline: true

[duziten]

mobx 官方demo也有这个问题，只要inject('store')之后,正确设置了onShareTimeline和onShareAppMessage之后均无效，在mount之后调用Taro.showShareMenu(option)只会出现转发按钮，朋友圈按钮置灰。后面发现解决办法是配enableShareAppMessage 、enableShareTimeline这两项