zoukankan      html  css  js  c++  java
  • react Native如何实现跨平台

    react Native如何实现跨平台

         react Native是通过虚拟DOM实现跨平台,运行时

         将虚拟DOM转换为相应的web编码、android编号、ios编码进行运行的。

      

       代码实现:

         01.html:

         <!DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="UTF-8">
            <script src="react.js"></script>
            <script src="react-dom.js"></script>
            <script src="babel.min.js"></script>
            <script type="text/babel" src="02.js"></script>
            <style type="text/css">
                .text{
                    color : red;
                }
            </style>
            <title>React</title>
        </head>
        <body>
            <div id="myDiv"></div>
        </body>
        </html>

         01.js:

         //React.js
        //React 组件化(组件的重用)
        //自定义组件
        class ChildText extends React.Component{
            //组件的内容
            render(){
               return <div>
                   Hello <b>React!</b>
            </div>;
            }
        }

        class WrapperText extends React.Component{
            render(){
                //虚拟DOM(Document Object Model)
                //html标签,小写开头
                //自定义组件:大写开头
                return <p>
                    <ChildText></ChildText>
                    <span>kerry</span>
                </p>;
            }
        }

        //绘制到页面中
        ReactDOM.render(<WrapperText></WrapperText>, document.body);

       运行 01.html:

            网页显示:   Hello React!

             kerry

  • 相关阅读:
    Linux配置Java环境
    Oracle的flashback特性之一:Flashback Query
    Oracle的flashback特性之二:Flashback Table
    吴恩达深度学习笔记 (补)1.1~1.5 神经网络概述
    吴恩达深度学习笔记 2.10~2.18 向量化与python
    吴恩达深度学习笔记 2.6~2.9 logistic中的梯度下降
    吴恩达深度学习笔记 2.3 logistic回归损失
    吴恩达深度学习笔记2.2 logistic回归
    吴恩达深度学习笔记2.1 二分分类
    [ubuntu]安装并使用python 3.6及与2.7的切换
  • 原文地址:https://www.cnblogs.com/qqpw/p/6629487.html
Copyright © 2011-2022 走看看