如果你看到这里,那不得不恭喜你,你已经理解了 Taro 中最复杂的概念:入口组件和页面组件,并了解了它们是如何(通过配置文件)交互的。接下来的内容,如果你已经熟悉了 React 或 Vue 以及 Web 开发的话,那就太简单了:
我们先把首页写好,首页的逻辑很简单:把论坛最新的帖子展示出来。
src/pages/index/index.vue
了解更多
可能你会注意到在一个 Taro 应用中发送请求是 Taro.request()
完成的。 和页面配置、全局配置一样,Taro 的 API 规范也是基于微信小程序而制定的,并对全平台进行统一。 你可以通过在 API 文档 找到所有 API。
在我们的首页组件里,还引用了一个 ThreadList
组件,我们现在来实现它:
src/components/thread_list.vue
src/components/thread.vue
{{member.username}}
{{time}}
评论 {{replies}}
{{node.title}}
{{title}}
这里可以发现我们把论坛帖子渲染逻辑拆成了两个组件,并放在 src/components
文件中,因为这些组件是会在其它页面中多次用到。 拆分组件的力度是完全由开发者决定的,Taro 并没有规定组件一定要放在 components
文件夹,也没有规定页面一定要放在 pages
文件夹。
另外一个值得注意的点是:我们并没有使用 div
/span
这样的 HTML 组件,而是使用了 View
/Text
这样的跨平台组件。