从入门到放弃?还是真香警告?Taro多端开发

前言:

"以微信小程序为主,  之后拓展至多平台发布"——万恶的需求

 

在uniapp和taro之间纠结了一会

虽然uniapp对vue更友好更全面

但是，vscode实在太香，果断选了taro

 

咱也不知道，咱也不敢说，到底能不能用taro做点东西出来呢？

硬着头皮上吧！

 

颤颤巍巍的打开文档

 

咋一看了，两眼发光，真香+1

 

 

 

哦豁，了不得啊，还能支持vue3，真香+2

然而，也只能在空闲时间体验一下

 

赶紧步入正轨吧

 

1、安装：没什么好说的，跟着文档就行了

 

 

2、项目文件：初始化完成后的项目结构

 

 

3、运行：在package.json文件中已经声明了所有运行命令, 根据你的需要可以运行不同的命令, 在相应的开发工具中导入项目就可以

 

哈哈，到目前为止好像没什么难度， 按文档操作就行了。

项目跑起来了，真香+3

 

4、看看config中的index配置文件

 

 

各项配置清晰明了, 按需配置。

 

下面说一下项目整体开发

1.typescript使用

a.想要在.vue文件中使用ts, 需要我们在项目中安装:   "vue-property-decorator"包

b.在 .vue 文件中 <script lang="ts">使用ts语法

c.import { Component, Vue } from 'vue-property-decorator'

d.组件注册

 

e.使用ts语法后，就要改变过去vue的写法

 

f.组件写法:

 

g.使用小程序的生命周期时，你会发现编译后并没有执行，原因是我们需要在app.ts入口文件中注册一下才能正常使用

 

2.taro框架已经集成了大部分平台api

在开发中为了方便使用，可以将taro注册到全局中使用

 

这样我们就可以在项目文件中通过this.$Taro的方式使用taro框架提供的api了

3.taro接口请求

为了多端统一，taro也封装了Taro.request()方式实现发送请求

项目中可以根据自己需要，做进一步封装

使用：

 

以上弄好了, 我们就可以在src下的pages文件中开始写我们的页面啦，总体来说不难，结合taro文档，能解决掉大部分问题。小部分问题当然也有：

1.如果使用了video组件, 想要自定义播放按钮, 我在使用过程中发现通过createVideoContext()的方法, 执行play(), 在微信开发者工具中是可行的, 但是在真机上调试是不生效的, 目前还没有解决方案, 已经提了issue, 看看有没有回复

2.微信小程序授权获取用户信息的方式现在也只能通过button的 open-type 属性, 让用户手动授权, 调用getUserInfo不再弹出授权窗口

到目前为止， taro开发还是比较香的，自己也是第一次使用taro开发，希望随着项目的迭代，自己也能更了解taro。

我是mofle，我在公众号：无JS不前端

等你