调用 function 在 javascript 中显示 html

Question

我的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;

我想从这里调用这个 function：

 } else {

                        
       myGif()

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

当我像这样调用 myGif() 时，它不会显示在屏幕上。 我该怎么做呢？

Answer 1

React 组件不应该呈现另一个html或body标签，它应该只是div 。 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 组件也不作为函数调用，而是将它们模板化为可渲染的 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