June 1 Use of react

Source: Internet
Author: User

React use and JSX conversion pre-skill: Chrome Browser A. Take sugar: The use of react

React v0.14 RC released, Major update Project:

Two packages: React and React DOM

DOM node Refs

Stateless functional components

Discard React-tools

Compiler optimizations

eat Sugar:Straight to the point, on the code.
<! DOCTYPE html>
React-0.13.4.js use: Browser console display no problem: if replaced by REACT-0.14.0.J, the console display: The page can be displayed, but there are hints: React.render is discarded. It is recommended to use the Reactdom.render in React-dom.js instead. So, we'll use react-dom.js to get it.
<! DOCTYPE html>
The console is clean.two. Knowledge pointsJsxtransformer.js: His role is to convert the JSX syntax into JavaScript syntax. So that the browser can execute. However, this time-consuming comparison is generally performed on the server side. (How to spend time, what is a concept, I do not know) of course we can not jsx,react is JS. What is JSX: The code in the JavaScript code that writes the XML format is called JSX. So the above code can also be changed to:
<script type= "text/javascript" >  reactdom.render (react.createelement (     "H1",     null,     "Hello world!"    ), document.getElementById ("example"), function () {    console.log ("ok!");}); </script>
Remember to change text/jsx into Text/javascript. So many people say that the essence of jsx is a grammatical sugar.three. Remove sugar: How to convert jsx into JS code. >1. We can passBabelConvert the tool into JS code. >2. Installing the React-tools conversion Tool NPM Install-g React-tools run: Build the build file, if you do not know how to use the tool: the first line of Jsx-h is to use the format: USAGE:JSX [Options] <source directory> <output directory> [<module id> [<module id> ...]

June 1 Use of react

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.