调用Lifestyle 不显示

[byjs]

相关平台

支付宝小程序

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

复现步骤

生活号已关联小程序，组件调用无反应

import { Lifestyle } from '@tarojs/components/lib/react'; <Lifestyle public-id={'生活号id'}/>

期望结果

显示组件

实际结果

页面无反应 甚至连元素都没有

环境信息

👽 Taro v3.6.19


  Taro CLI 3.6.19 environment info:
    System:
      OS: macOS 12.4
      Shell: 5.8.1 - /bin/zsh
    Binaries:
      Node: 16.15.0 - /usr/local/bin/node
      Yarn: 1.22.17 - /usr/local/bin/yarn
      npm: 7.24.2 - /usr/local/bin/npm
    npmPackages:
      @tarojs/cli: 3.6.2 => 3.6.2 
      @tarojs/components: 3.6.2 => 3.6.2 
      @tarojs/helper: 3.6.2 => 3.6.2 
      @tarojs/plugin-framework-react: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-alipay: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-h5: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-jd: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-qq: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-swan: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-tt: 3.6.2 => 3.6.2 
      @tarojs/plugin-platform-weapp: 3.6.2 => 3.6.2 
      @tarojs/react: 3.6.2 => 3.6.2 
      @tarojs/runtime: 3.6.2 => 3.6.2 
      @tarojs/shared: 3.6.2 => 3.6.2 
      @tarojs/taro: 3.6.2 => 3.6.2 
      @tarojs/webpack5-runner: 3.6.2 => 3.6.2 
      babel-preset-taro: 3.6.2 => 3.6.2 
      eslint-config-taro: 3.6.2 => 3.6.2 
      react: ^18.0.0 => 18.2.0 
    npmGlobalPackages:
      typescript: 4.2.3

[TheKonka]

- import { Lifestyle } from '@tarojs/components/lib/react';
+ import { Lifestyle } from '@tarojs/components';

[byjs]

- import { Lifestyle } from '@tarojs/components/lib/react';
+ import { Lifestyle } from '@tarojs/components';

3.6.19 版本的 @tarojs/components已经没有导出这个组件了

[TheKonka]

可能是类型问题，你不管报错，直接用能生效吗？

[byjs]

可能是类型问题，你不管报错，直接用能生效吗？

需要设置他的样式吗，看到标签加载了 但是不显示

[TheKonka]

应该不设置样式也可以，你试下支付宝原生小程序可以正常展示吗？

[zzyzjc]

怎么样，有解了吗？我也一直不显示啊。支付宝原生小程序是可以正常显示的。用Taro编译后丢失属性sceneId

[TheKonka]

怎么样，有解了吗？我也一直不显示啊。支付宝原生小程序是可以正常显示的。用Taro编译后丢失属性sceneId

https://opendocs.alipay.com/mini/component/lifestyle

没用过这个组件，我看支付宝文档里面没有 sceneId 啊？

https://github.com/NervJS/taro/blob/ccc6ff7946c99b4dd5f93357d3e8640112cd2288/packages/taro-alipay/src/components.ts#L134-L138

如果确实需要的话要在这里添加一下，现在是没有 sceneId 的

[zzyzjc]

文档内确实是没有sceneId属性，但是添加关注组件的时候，默认给到的代码就是只有sceneId这个属性。 通过Taro编译后，这个属性就不见了。编译后在支付宝开发者工具中，手动添加<lifestyle sceneId="" />是有效的，可以正常显示。反而这上面说的这三个属性加上了也不显示。

[byjs]

从工具里的编译器可以看到代码是这样的，是都有的public-id和 scene-id
<template name="tmpl_0_26"> <lifestyle public-id="{{i.p1}}" scene-id="{{i.p2}}" memo="{{i.p0}}" onFollow="eh" style="{{i.st}}" class="{{i.cl}}" onTap="eh" onTouchMove="eh" onTouchEnd="eh" onTouchCancel="eh" onLongTap="eh" id="{{i.uid||i.sid}}" data-sid="{{i.sid}}"> <block a:for="{{i.cn}}" a:key="sid"> <template is="{{xs.a(0, item.nn)}}" data="{{i:item}}" /> </block> </lifestyle> </template>

我的代码是这样写的 <Lifestyle sceneId="4a************" /> 但从Elements中看到的又是这样的： <lifestyle id="_Ac" data-sid="_Ac"></lifestyle> 页面还是什么都不显示

[zzyzjc]

两种解决办法： 一、VS中编译完后，手动在开发者工具里面添加一下 二、在配置文件中新增sceneId属性 plugins: [ '@tarojs/plugin-html', 'taro-plugin-compiler-optimization', ['@tarojs/plugin-inject', { components: { Lifestyle: { 'sceneId': "'sceneId'" } } }] ] 两种方式都可以

[Damoness]

sceneId

sceneId是什么