Tenon React ​

什么是 Tenon React ? ​

Tenon React 是应用于 Hummer 跨端平台的 React 框架。帮助大家使用 React 的语法，快速的构建用户界面。

快速上手 ​

安装 ​

1. 全局安装 Hummer CLI，请参见 Hummer CLI 使用。
2. 执行 hummer init选择 template-react模板工程进行创建即可。
3. 切到工程中，执行 npm install，安装对应依赖。
4. 项目中执行 npm run dev 或者 hummer dev开启 Dev 模式。
5. 在浏览器预览页中，使用 Playground 进行扫码即可预览。

语法教程 ​

Tenon React 对 React 的语法设计是完全兼容的。

React 相关教程可参考React 文档。

Tenon React 与 React 的区别？ ​

1. Tenon React 不需要指定宿主，直接渲染我们的页面。 ​

Tenon React

import Tenon from '@hummer/tenon-react';
import app from './app';

Tenon.render(app);

React

// React
import ReactDOM from 'react-dom'

import App from "./App.jsx"

ReactDOM.render(<App/>, document.getElementById("app"))

2. 模板标签不一样，需要使用 Tenon 的基础组件和高阶组件来编写模版文件，而 React 则使用 Html5 标准的标签。 ​

Tenon React

const App = function(){
  return (
    <>
      <view>
        <text className="message">Hello Tenon React!</text>
      </view>
    </>
  )
}

React

const App = function(){
  return (
    <>
      <div>
        <span className="message">Hello Tenon React!</span>
      </div>
    </>
  )
}