Great question. I assume you are talking about the jsxLoader. Yes there are several different methods:

Example using Global React Object

// This exits at the top of the file:
const useState = React.useState;
const useReducer = React.useReducer;

https://awesome-web-react.js.org/examples/state-management/react-hooks.htm

Source
https://github.com/dataformsjs/awesome-web-react/blob/master/examples/state-management/react-hooks.jsx

Docs
This topic in the doc shows several additional options, for example if coming from node/webpack and copying and pasting the a file for browser then simple find and replace methods can be used to handle existing code.
https://github.com/dataformsjs/dataformsjs/blob/master/docs/jsx-loader.md#handling-node-importexport-statements-and-browser-exportsrequire

Here are a few more examples using popular hook libraries:

React Hook Form
https://awesome-web-react.js.org/examples/forms/react-hook-form.htm

React Query
https://awesome-web-react.js.org/examples/component-and-hook-libraries/react-query.htm

Basically JSX Loader simply transforms the JSX to JS for modern browsers (happens in milliseconds) and if a old browser is used (IE 11, older iPhones with Safari, etc) then the JSX Loader will download Babel Standalone and use that for the compiler.

As for the React Components currently only Components have been published for DataFormsJS. For example <JsonData> which is used to easily specify JSON Web Services and pass the data to child components:

function DataPage() {
    return (
        <JsonData
            url="https://www.dataformsjs.com/data/geonames/countries"
            isLoading={<ShowLoading />}
            hasError={<ShowError />}
            isLoaded={<LazyLoadDataPage />}
            loadOnlyOnce={true} />
    );
}

react hooks support? #17

Description

Activity

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions