Use React and CSS to build UI interfaces on canvas
Document | 中文文档 | Live DEMO | DEMO Code
Install
$ yarn add revas react
Usage
Render to a DOM
import React from 'react'
import {render, View, Text} from 'revas'
render(
<View style={{ flex: 1 }}>
<Text style={{ fontSize: 20 }}>Revas</Text>
</View>,
document.getElementById('container')
)
Render to a DOM rendered by React
import React from 'react'
import {render, View, Text} from 'revas'
export class Widget extends React.Component {
componentDidMount() {
this.app = render(
<View style={{ flex: 1 }}>
<Text style={{ fontSize: 20 }}>Revas</Text>
</View>,
document.getElementById('container'),
this
)
}
componentDidUpdate() {
this.app.update()
}
componentWillUnmount() {
this.app.unmount()
}
render() {
return <div id="container" />
}
}
Render to a custom canvas api
DEMO
Other Framework
- Vue - huruji/vuvas by @huruji