Я работаю с игроком. Я занимаюсь разработкой веб-сайта в React и хочу использовать фрагмент видео-плеера для использования на некоторых страницах. Поэтому я создаю скрипт videoFr. js с этим кодом.
import React from 'react'
import '../styles/video.scss';
const fragmentPlayer =(props)=> {
return (
<>
<iframe
width="560"
height="315"
src={props.url}
frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</>
)
}
export default fragmentPlayer;
Я хочу рендерить на главной странице видео и передать компонент.
import React from 'react'
import '../styles/Main.scss';
import fragmentPlayer from '../Components/video.js';
class Main extends React.Component {
render(){
return (
<body>
<sector id='banner'>
<h1>hi {this.props.name}</h1>
<h1>- Culture</h1>
<p>We unite business and education. And much more...</p>
<fragmentPlayer url="https://www.youtube.com/embed/QTACugN67yc"/>
</sector>
<sector id='m-training'>
<h1>TRAINING & COMPETITION</h1>
<p>Every semester, thousands participants from over 90 countries join the X-Culture competition.
<br/>They compete, collaborate, learn the challenges and best practices of international business consulting.</p>
</sector>
<sector id='m-business'>
<h1>BUSINESS SOLUTIONS</h1>
<p>Companies present their business challenges. Thousands of amateurs and professionals develop their solutions.
<br/>If there is something good for your business out there, they will find it and bring it to you.</p>
</sector>
</body>
)
}
}
export default Main;
Ничего не происходит при рендеринге. Тем не менее, когда я импортирую не fragPlayer из моего скрипта, а Player и использую Player - все работает нормально.
import Player from '../Components/video.js';
<Player url="https://www.youtube.com/embed/QTACugN67yc"/>
Что здесь происходит?