b站微信小程序代码转换为uniapp

微信b站小程序转uniapp所使用到的工具链接：https://www.jianshu.com/p/c44bfd41cb14

1.微信小程序转uniapp工具

微信小程序转换uniapp使用的工具：https://github.com/zhangdaren/miniprogram-to-uniapp

// npm全局安装工具
npm install miniprogram-to-uniapp -g

// 对微信小程序进行转换
wtu -i miniprogramProject

之后就会在你项目的同级目录看到转换后的uniapp的代码。

2.转换后遇到的问题

2.1报错：this.onload is not a function

image.png

解决思路：使用console.log(this) 查看 是否有this.onLoad。
下图发现onLoad方法是在$scope下的，所以将this.onLoad()改为this.$scope.onLoad()即可运行。

image.png

2.2代码问题

原来的代码：

              <view class="content-wrapper">
                    <block v-for="(item, avid) in liveList" :key="avid">
                        <!-- 使用正在直播模板，传入当前循环对象item -->
                        <block data-type="template" data-is="jiefItem2" data-attr="...item">
                            <!-- List Item begin -->
                            <view class="content-list">
                                <navigator class="item">
                                    <view class="top">
                                        <view class="cover-img" :style="'opacity: 1 background-image: url(' + coverImg + ')'">
                                        </view>
                                    </view>
                                    <view class="info">
                                        <view class="avatar">
                                            <image mode="scaleToFill" :src="avatarImg"></image>
                                        </view>
                                        <view class="user">
                                            <view class="name text-overflow">{{name}}</view>
                                            <view class="desp text-overflow">{{desp}}</view>
                                        </view>
                                        <view class="online text-overflow">{{online}}</view>
                                    </view>
                                </navigator>
                            </view>
                            <!-- List Item end -->
                        </block>
                    </block>
                </view>

手工修改后的代码：

              <view class="content-wrapper">
                    <block v-for="(item, avid) in liveList" :key="avid">
                        <!-- 使用正在直播模板，传入当前循环对象item -->
                        <view class="content-list">
                            <navigator class="item">
                                <view class="top">
                                    <view class="cover-img" :style="'opacity: 1; background-image: url(' + item.coverImg + ')'">
                                    </view>
                                </view>
                                <view class="info">
                                    <view class="avatar">
                                        <image mode="scaleToFill" :src="item.avatarImg"></image>
                                    </view>
                                    <view class="user">
                                        <view class="name text-overflow">{{item.name}}</view>
                                        <view class="desp text-overflow">{{item.desp}}</view>
                                    </view>
                                    <view class="online text-overflow">{{item.online}}</view>
                                </view>
                            </navigator>
                        </view>
                    </block>
                </view>
            </view>