Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Custom Component Not Working#1450

Unanswered
umutyorulmaz asked this question inQ&A
Discussion options

Hey, I wrote this code in the custom component:

<div></div><script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.18.6/babel.min.js"></script> <script src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script><script type="text/babel">  const App = () => {    return React.createElement(      'div',      { style: { border: '1px solid blue', padding: '20px' } },      React.createElement('h1', null, 'Hello, Openblocks!'),      React.createElement('p', null, 'This is your custom component.')    );  };  ReactDOM.render(React.createElement(App), document.getElementById('root'));</script>

and under data:

{  "query": "MockQuery"}

however I just see blank white screen. I can observe at the network tab libraries loaded and no request errors. Also I added al the libraries I need from JavaScript Library section. What I do wrong?

errors and warning from console:

The value "noviewport-fit" for key "user-scalable" is invalid, and has been ignored.
index.html:1 The key "cover" is not recognized and ignored.
2Uncaught ResizeObserver loop completed with undelivered notifications.

You must be logged in to vote

Replies: 1 comment

Comment options

We may not understand why you try to load react - cause the custom component has this already pre-loaded for you.
Likely this is the reason why the display does not work?

Also please follow the advised way of the render method: ReactDOM.createRoot()

<div></div><script type="text/babel">  const MyCustomComponent = ({ runQuery, model, updateModel }) => (    <your code here>  );  const ConnectedComponent = Lowcoder.connect(MyCustomComponent);  const root = ReactDOM.createRoot(document.getElementById("root"));  root.render(<ConnectedComponent />);  </script>
You must be logged in to vote
0 replies
Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment
Category
Q&A
Labels
None yet
2 participants
@umutyorulmaz@FalkWolsky
[8]ページ先頭
©2009-2025 Movatter.jp