Documentation | 中文文档 | Live DEMO

Installing Revas

Before diving into building beautiful user interfaces, we need to install Revas along with React. Open your terminal and run the following command:

bash
$ yarn add revas react

Usage Examples

Let’s explore how to render components to the DOM using Revas.

Render to a DOM

Here’s how you can render your component using Revas:

jsx
import React from 'react';
import render, { View, Text } from 'revas';

render(
  
    Revas
  ,
  document.getElementById('container')
);

Render to a DOM Rendered by React

This example shows how to create a component that renders to the DOM:

jsx
import React from 'react';
import render, { View, Text } from 'revas';

export class Widget extends React.Component {
  componentDidMount() {
    this.app = render(
      
        Revas
      ,
      document.getElementById('container'),
      this
    );
  }

  componentDidUpdate() {
    this.app.update();
  }

  componentWillUnmount() {
    this.app.unmount();
  }

  render() {
    return 
;
  }
}

Render to a Custom Canvas API

You also have the option to render to a custom canvas API. For examples, check out:

• wxgame example
• bytegame example

Demo

Integrating with Other Frameworks

If you are working with Vue, check out hurujivuvas created by @huruji.

Troubleshooting

If you encounter issues while implementing Revas, consider the following troubleshooting steps:

• Ensure your React version is compatible with the installed Revas version.
• Check your console for errors during rendering.
• Verify that the container ID used in the render function exists in the HTML.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.