调用 function 在 javascript 中显示 html

Question

I have this function in my spinner.js file:我的spinner.js文件中有这个 function：

import React from 'react';
import broomAndText from './ezgif.com-video-to-gif-3.gif';
import './spinner.css';

        function myGif() {
    
        return <html><body><div class="imgContainer"><img src={broomAndText} alt="broomAndText"/></div></body></html>

    }
    
    export default myGif;

I want to call this function from here:我想从这里调用这个 function：

 } else {

                        
       myGif()

        createCheckoutSession()
         console.log("does not exist!")
     }
   });

when I call myGif() like this, it does not display onto screen.当我像这样调用 myGif() 时，它不会显示在屏幕上。 how do i do this?我该怎么做呢？

Answer 1

React components shouldn't render another html or body tag, it should be just the div . React 组件不应该呈现另一个html或body标签，它应该只是div 。 React components also use a className prop. React 组件也使用一个className属性。

import React from 'react';
import broomAndText from './ezgif.com-video-to-gif-3.gif';
import './spinner.css';

function MyGif() {
  return (
    <div class="imgContainer">
      <img src={broomAndText} alt="broomAndText"/>
    </div>
  );
}

export default MyGif;

React components are also not called as functions, but rather they are templated into renderable JSX and the React framework handles calling the function during the component lifecycle. React 组件也不作为函数调用，而是将它们模板化为可渲染的 JSX，并且 React 框架在组件生命周期中处理调用 function。

import MyGif from '../path/to/MyGif";

...

return (
  ...
  <MyGif />
  ...
);

调用 function 在 javascript 中显示 html

问题描述

1 个解决方案

解决方案1
1 2021-04-26 01:04:30

调用 function 在 javascript 中显示 html

问题描述

1 个解决方案

解决方案1 1 2021-04-26 01:04:30

解决方案1
1 2021-04-26 01:04:30