React + Taro 小程序跳转公众号

Taro小程序跳转公众号的文章

步骤：登录公众号后台-小程序-小程序管理-添加-关联小程序

关联后就可以在微信的公众平台查看(设置-关联设置-关联公众号)
如图所示：

然后使用web-view

我这个是使用广告轮播实现的代码如下

注意：一个页面使用一个web-view 所以我使用遍历传值到跳转地址的页面

html代码

 {/* 跳转公众号的文章 */}
        <View>
          <AtCurtain
            isOpened={this.state.isOpened}
            onClose={this.onClose.bind(this)}
            closeBtnPosition:true
          >
            <Swiper
              className="swip-curtain"
              indicatorColor="#999"
              indicatorActiveColor="#333"
              circular
              autoplay
              indicatorDots="true"
              indicatorActiveColor="#0080ff"
            >
              {ad.map((item, index) => {
                return (
                  <Navigator url={`${item.jumpUrl}?webUrl=${item.webUrl}`} key={index}>
                    <SwiperItem>
                      <View className="demo-text-1">
                        <Image
                          className="swip-image"
                          style="width: 100%;height:500rpx;background: #fff;"
                          src={item.image}
                        />
                      </View>
                    </SwiperItem>
                  </Navigator>
                );
              })}
            </Swiper>
          </AtCurtain>
        </View>

js代码

//接收传入的文章地址
 componentDidMount(){
    // this.getAdImg()
    const { webUrl } = this.$router.params;
    this.setState({
      webUrl: webUrl,
    });
    console.log("传入的值")
    console.log(webUrl);
  }

// 遍历到对应的web-view上
	render() {
    return (
      <View>
      	<web-view src={this.state.webUrl}></web-view>
      </View>
    );
  }

如果觉得文章还行的话，可以给我一颗小星星嘛，谢谢啦 ~~

加油元芳，明天会更好的 ~~