Metrics
0
Watch 5 Star 11 Fork 2

nobo / neactJavaScript

Sign up for free
Explore and code with more than 2 million developers,Free private repositories !:)
Sign up
Neact is a fast alternative to React, support ie8 spread retract

Clone or download
Cancel
Notice: Creating folder will generate an empty file .keep, because not support in Git
Loading...
README.md

Neact

Neact is a fast alternative to React, support ie8

Usage


Neact.render(Neact.createElement('div', null, 'Hello Neact!'), document.body);

Install

npm install neact
bower install neact

Getting Started

How to use JSX

// 1.best to configure it globally in a .babelrc
// 2.Tell Babel to transform JSX into Neact.createElement() calls:
/** @jsx Neact.createElement */

function App(){
	return (
        <div id="foo">
            <span>Hello, world!</span>
            <button onClick={ e => alert("hi!") }>Click Me</button>
        </div>
    );
};

Neact.render(<App />, document.body);

hooks Lifecycle

Lifecycle method When it gets called
create see componentDidMount
beforeUpdate see componentWillUpdate
update see componentDidUpdate
destroy see componentDidUnmount
let hooks = {
    create(vNode) {
        //TODO:
        //vNode.dom
    },
    beforeUpdate(lastVNode, nextVNode){
        //TODO:
    },
    update(nextVNode){
        //TODO:
    },
    destroy(vNode){
        //TODO:
    }
}

Neact.render(<div hooks={hooks}>Test</div>,document.body)

Class Components Lifecycle

Lifecycle method When it gets called
componentWillMount before the component gets mounted to the DOM
componentDidMount after the component gets mounted to the DOM
componentWillUnmount prior to removal from the DOM
componentWillReceiveProps before new props get accepted
shouldComponentUpdate before render(). Return false to skip render
componentWillUpdate before render()
componentDidUpdate after render()
var App = Neact.createClass({
    render(){
        return 'Test'
    },
    componentWillMount(){},
    componentDidMount(){},
    componentWillUnmount(){},
    componentWillReceiveProps(){},
    shouldComponentUpdate(){},
    componentWillUpdate(){},
    componentDidUpdate(){}
});

Neact.render(<App />,document.body)

Functional Components Lifecycle

Lifecycle method When it gets called
onComponentWillMount before the component gets mounted to the DOM
onComponentDidMount after the component gets mounted to the DOM
onComponentWillUnmount prior to removal from the DOM
onComponentShouldUpdate before render(). Return false to skip render
onComponentWillUpdate before render()
onComponentDidUpdate after render()
let Lifecycle = {
    onComponentWillMount(vNode){},
    onComponentDidMount(vNode){},
    onComponentWillUnmount(vNode){},
    onComponentShouldUpdate(lastProps, nextProps, context){},
    onComponentWillUpdate(lastProps, nextProps, vNode){},
    onComponentDidUpdate(nextVNode){}
}

var App = function(){
    return 'Test'
};

Neact.render(<App {...Lifecycle} />,document.body)

License

MIT

Comments ( 0 )

You need to Sign in for post a comment

JavaScript
1
https://gitee.com/extgrid/neact.git
git@gitee.com:extgrid/neact.git

Help Search