Swiper的两个问题

[ShaoGongBra]

相关平台

React Native

使用框架: React

复现步骤

1 因为给Item嵌套了一层View，导致无法Item无法显示
2 如果使用下面这种写法，并且使用衔接滑动会报错

<Swiper className='w-full' circular style={{ height: px(750) }} onChange={e => setSelect(e.detail.current)}>
      {
        videos.map(item => <SwiperItem key={item}>
          <Video src={item.url} poster={images[0]} className='w-full h-full' />
        </SwiperItem>)
      }
      {
        images.map(item => <SwiperItem key={item}>
          <Image preview images={images} src={item} poster={images[0]} className='w-full h-full' />
        </SwiperItem>)
      }
    </Swiper>

修改建议

diff --git a/node_modules/@tarojs/components-rn/dist/components/Swiper/carousel.js b/node_modules/@tarojs/components-rn/dist/components/Swiper/carousel.js
index e5b2464..e631985 100644
--- a/node_modules/@tarojs/components-rn/dist/components/Swiper/carousel.js
    b/node_modules/@tarojs/components-rn/dist/components/Swiper/carousel.js
@@ -138,20  138,17 @@ class Carousel extends React.Component {
         let pages;
         if (count > 1) {
             const childrenArray = React.Children.toArray(children);
             const childrenArrayData = [...childrenArray];
             if (infinite) {
                 for (let index = 0; index < INFINITE_BUFFER; index  ) {
-                    childrenArray.push(React.cloneElement(children[index], { ref: null }));
-                    childrenArray.unshift(React.cloneElement(children[count - index - 1], { ref: null }));
                     childrenArray.push(React.cloneElement(childrenArrayData[index], { ref: null }));
                     childrenArray.unshift(React.cloneElement(childrenArrayData[count - index - 1], { ref: null }));
                 }
             }
-            pages = childrenArray.map((page, i) => {
-                return (
-                // when vertical, use the height of the first child as the height of the Carousel
-                React.createElement(View, { key: i }, page));
-            });
             pages = childrenArray;
         }
         else {
-            pages = React.createElement(View, null, children);
             pages = children;
         }
         const vpProps = {
             initialPage: selectedIndex,

环境信息

Taro CLI 4.0.5 environment info:
    System:
      OS: macOS 14.5
      Shell: 5.9 - /bin/zsh
    Binaries:
      Node: 18.20.3 - /var/folders/rf/gd60z12164z72bny7z_0d4f80000gn/T/yarn--1725682720834-0.43605118164399004/node
      Yarn: 1.22.22 - /var/folders/rf/gd60z12164z72bny7z_0d4f80000gn/T/yarn--1725682720834-0.43605118164399004/yarn
      npm: 10.7.0 - ~/.nvm/versions/node/v18.20.3/bin/npm
    npmPackages:
      @tarojs/cli: 4.0.5 => 4.0.5 
      @tarojs/components: 4.0.5 => 4.0.5 
      @tarojs/helper: 4.0.5 => 4.0.5 
      @tarojs/plugin-framework-react: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-alipay: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-h5: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-jd: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-qq: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-swan: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-tt: 4.0.5 => 4.0.5 
      @tarojs/plugin-platform-weapp: 4.0.5 => 4.0.5 
      @tarojs/react: 4.0.5 => 4.0.5 
      @tarojs/rn-runner: 4.0.5 => 4.0.5 
      @tarojs/rn-supporter: 4.0.5 => 4.0.5 
      @tarojs/runtime: 4.0.5 => 4.0.5 
      @tarojs/shared: 4.0.5 => 4.0.5 
      @tarojs/taro: 4.0.5 => 4.0.5 
      @tarojs/taro-loader: 4.0.5 => 4.0.5 
      @tarojs/taro-rn: 4.0.5 => 4.0.5 
      @tarojs/webpack5-runner: 4.0.5 => 4.0.5 
      babel-preset-taro: 4.0.5 => 4.0.5 
      eslint-config-taro: 4.0.5 => 4.0.5 
      expo: ~52.0.0-canary-20240904-69100c1 => 52.0.0-canary-20240904-69100c1 
      react: ^18.2.0 => 18.3.1 
      react-native: ~0.75.2 => 0.75.2