taro学习系列二,组件库、生命周期、路由、网络请求、内置环境变量、新页面创建
发布于 4 年前 作者 yejuan 4627 次浏览 来自 分享

今天开始学习Taro第二天,具体计划安排是认识taro里面的生命周期、路由、网络请求、内置环境变量,同时要创建一个新页面,很简单,但是作为一个taro初学者,这是非常必要的一步。

本文参考taro官方文档如下

https://5ed4d0957668344d67c1df67--taro-docs.netlify.app/taro/docs/next/guide/

taro学习系列一,环境搭建、项目初始化以及项目目录解读

https://developers.weixin.qq.com/community/develop/article/doc/0000ea6afd0b101b3e7a5c75f5b813

taro学习系列二,生命周期、路由、网络请求、内置环境变量、新页面创建

https://developers.weixin.qq.com/community/develop/article/doc/00008499e940605d467a2537b51813


组件库


https://5ed4d0957668344d67c1df67–taro-docs.netlify.app/taro/docs/components-desc

看了下文档,基本的感受是,taro的组件库相比微信原生的小程序组件只是在大小写发生了变化,除此之外没有其他感受,这一点有待在以后的项目开发中去验证。

比如以下几个是日常开发最常用大高频组件

1、View对应微信小程序的view,

2、Text对应text,

3、Swiper对应swiper,SwiperItem

4、Image

5、Input

6、Button

但是微信原生提供的block,没有找到对应的支持。

生命周期

我们都知道原生小程序有一套自己的生命周期,那么taro框架封装的生命周期,是完全采用react生命周期还是在原生小程序和react这两者各有体现,我们接着学习。

1

2

以下这句话摘自taro官方文档

Taro 在运行时将大部分小程序规范页面生命周期注入到了页面组件中,同时 React 或 Vue 自带的生命周期也是完全可以正常使用的。

通过该文档,我们可以看到taro里面的生命周期是各有采用,你们到底原生小程序生命周期具体引入了多少,接着学习

https://5ed4d0957668344d67c1df67–taro-docs.netlify.app/taro/docs/tutorial

当然作为框架,我们既然要用,我个人建议就要摒弃微信小程序原生的生命周期,完全采用react这一套

2


路由功能

路由功能,

通过下面截图,我们不难看出,taro的路由,跟小程序原生路由高度一致,只有将前缀的wx换成了taro。

如果路由里面携带了参数,具体参数接收方式如下所示

3


网络请求

关于网络请求,目前没有看到跟微信原生有不一样的地方,如果随着学习的深入,发现差异,我会及时更新

4


页面文件

入口文件

https://5ed4d0957668344d67c1df67–taro-docs.netlify.app/taro/docs/tutorial

5普通的页面文件

6

内置环境变量

https://5ed4d0957668344d67c1df67–taro-docs.netlify.app/taro/docs/envs

新建项目开始今天的开发工作

在这里选择wxcloud云开发版本

项目初始化完成

7

2 回复

不错,加油

期待你后续的完整项目,加油!

回到顶部