{
  "pages":[
    "pages/logs/logs"
  ]
}

App({
  onLaunch: function () {
    // 小程序启动之后 触发
  }
})

Page({
  data: { // 参与页面渲染的数据
    logs: []
  },
  onLoad: function () {
    // 页面渲染后 执行
  }
})

Taro1.x

「Write once Run anywhere」

• H5
• ReactNative

<View className='index'>
  <Button className='add_btn' onClick={this.props.add}>+</Button>
  <Button className='dec_btn' onClick={this.props.dec}>-</Button>
  <Button className='dec_btn' onClick={this.props.asyncAdd}>async</Button>
  <View>{this.props.counter.num}</View>
  <A />
  <Button onClick={this.goto}>走你</Button>
  <Image src={sd} />
</View>

<import src="../../components/A/A.wxml" />
<block>
  <view class="index">
    <button class="add_btn" bindtap="add">+</button>
    <button class="dec_btn" bindtap="dec">-</button>
    <button class="dec_btn" bindtap="asyncAdd">async</button>
    <view>{{counter.num}}</view>
    <template is="A" data="{{...$$A}}"></template>
    <button bindtap="goto">走你</button>
    <image src="{{sd}}" />
  </view>
</block>

// 编译前
import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import './index.scss'

export default class Index extends Component {

  config = {
    navigationBarTitleText: '首页'
  }

  componentDidMount () { }

  render () {
    return (
      <View className=‘index' onClick={this.onClick}>
        <Text>Hello world!</Text>
      </View>
    )
  }
}

// 编译后
import {BaseComponent, createComponent} from '@tarojs/taro-weapp'

class Index extends BaseComponent {

// ... 

  _createDate(){
    //process state and props
  }
}

export default createComponent(Index)

1.1

1.2

1.3

• Taro Doctor

<div v-if="condition" :id="`item-${id}`" v-model="value"  @click="tapName"> {{ message }} </div>
-------------------------------------------编译--------------------------------------------------------
<view wx:if="{{condition}}" id="item-{{id}}" model:value="{{value}}"  bindtap="tapName"> {{ message }} </view>

Taro2.x

CLI

Taro3.x

CSS-in-JS

• 

• function render(element, domContainer, cb) {
      const oldRoot = ContainerMap.get(domContainer);
      if (oldRoot != null) {
          return oldRoot.render(element, cb);
      }
      const root = new Root(TaroReconciler, domContainer);
      ContainerMap.set(domContainer, root);
      return root.render(element, cb);
  }

Update Date

3.1

3.2

3.3

3.4 beta

3.5 canary