1.Taro 是一个开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发 微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ / 飞书 小程序 / H5 / RN 等应用。

2.安装 npm install -g @tarojs/cli

3.初始化项目 taro init myApp

4.编译

npm run dev:h5 --------- WEB

npm run dev:weapp --------- 微信小程序

npm run dev:alipay --------- 支付宝小程序

npm run dev:swan --------- 百度小程序

npm run dev:rn --------- ReactNative

5.安装taro-ui

6通过vue react 搭建

7react入口文件

import React, { Component } from 'react'

import './app.css'

class App extends Component {

render () {

// this.props.children 是将要会渲染的页面

return this.props.children

}

}

// 每一个入口组件都必须导出一个 React 组件

export default App

8.config配置

// app.config.js

export default {

// 页面路径列表

pages: [

'pages/index/index'

],

// 全局的默认窗口表现

window: {

backgroundTextStyle: 'light',

navigationBarBackgroundColor: '#fff',

navigationBarTitleText: 'WeChat',

navigationBarTextStyle: 'black'

},

// 底部 tab 栏的表现

tabBar: {}

// 网络超时时间

networkTimeout:{

request: 6000,

connectSocket: 6000,

uploadFile: 6000,

downloadFile: 6000

}

}

9.路由跳转

Taro.navigateTo({url:'/pages/index/index?blogTitle='+blogTitle+'&introduce='+introduce})

10.静态资源引入

import newbbd from '../../static/newbbd0001.jpg'

11.请求

Taro.request({
url:'https://apiblog.aliyun01.com/default/getArticleList'
}).then(res=>{
console.log(res.data)
})

taro 学习笔记的更多相关文章

  1. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  2. PHP-自定义模板-学习笔记

    1.  开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2.  整体架构图 ...

  3. PHP-会员登录与注册例子解析-学习笔记

    1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...

  4. 2014年暑假c#学习笔记目录

    2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...

  5. JAVA GUI编程学习笔记目录

    2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...

  6. seaJs学习笔记2 – seaJs组建库的使用

    原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...

  7. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  8. HTML学习笔记

    HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...

  9. DirectX Graphics Infrastructure(DXGI):最佳范例 学习笔记

    今天要学习的这篇文章写的算是比较早的了,大概在DX11时代就写好了,当时龙书11版看得很潦草,并没有注意这篇文章,现在看12,觉得是跳不过去的一篇文章,地址如下: https://msdn.micro ...

  10. ucos实时操作系统学习笔记——任务间通信(消息)

    ucos另一种任务间通信的机制是消息(mbox),个人感觉是它是queue中只有一个信息的特殊情况,从代码中可以很清楚的看到,因为之前有关于queue的学习笔记,所以一并讲一下mbox.为什么有了qu ...

随机推荐

  1. lock 和 Monitor (转载)

    Lock和Monitor都是对被操作对象同步控制的方法 Lock 是 Monitor的简化版本,IL callvirt ...Monitor.Enter(object)...leave.s.... c ...

  2. Vue导出模板、使用前端js办法导出表格数据、导入表格前端读取表格数据、导入表格发送后端读取数据

    以下是几种用的较多的函数方法,可以参考使用. // 導出1 myExport() { // post請求文件寫法1 const url = 'http://XXXX/XXXX/XXXX/XXXX' c ...

  3. Grafana 系列文章(二):使用 Grafana Agent 和 Grafana Tempo 进行 Tracing

    ️URL: https://grafana.com/blog/2020/11/17/tracing-with-the-grafana-cloud-agent-and-grafana-tempo/ ✍A ...

  4. Unity之Android端权限申请

    Unity之Android端权限申请 Unity之Android端权限申请 前言 开篇废话 Unity版本 正题 前期准备 挂载脚本 打包发布 安装App 查看结果 结尾 唠家常 今日无推荐 Unit ...

  5. 【分析笔记】DW7888 马达驱动芯片待机模式漏电流过高的问题

    发现问题 客户反馈说我们的硬件关机漏电流很大,但是拔掉电池之后再上电(仍处于关机状态)就会恢复为 16~20uA 左右.这让我也讶异,因为亲自测试过,漏电流只有 MCU 的休眠电流 16~20uA 左 ...

  6. AI 制作 3D 素材|基于 AI 5 天创建一个农场游戏,第 3 天

    欢迎使用 AI 进行游戏开发! 在本系列中,我们将使用 AI 工具在 5 天内创建一个功能完备的农场游戏.到本系列结束时,您将了解到如何将多种 AI 工具整合到游戏开发流程中.本文将向您展示如何将 A ...

  7. 5步带你入门GaussDB(DWS)的GDS导入导出

    摘要:本篇文档为使用GDS导入示例的具体简单步骤和示例. 本文分享自华为云社区<带你快速入门GDS导入导出,玩转PB级数仓GaussDB(DWS)>,作者: yd_220527686. 1 ...

  8. imax6开发版_交叉编译

    下载 arm-linux-gnueabihf-gcc编译器 sudo apt install gcc-arm-linux-gnueabihf #安装完成后使用如下命令查看版本 arm-linux-gn ...

  9. js程序

    JavaScript 程序 计算机程序是由计算机"执行"的一系列"指令". 在编程语言中,这些编程指令被称为语句. JavaScript 程序就是一系列的编程语 ...

  10. 软赢软件控制器在Zstack云主机实现电机控制的方法

    工控领域上云实践-Zstack和软赢 在上面链接提到软赢的软件运动控制器在Zstack云主机上实现etherCat总线的电机控制,在后来的对比中发现,在云主机上虽然实现了让电机转起来,但是因为实时性还 ...