视频自动播放不适用于 React。帮我？

Question

我使用 React 和 Webpack。我的问题是自动播放检查我的代码：

import React from "react";
import "../assets/styles/Components/Description.scss"
import Mafer from "../assets/static/Mafer.png"
import video from "../assets/static/VideoTS.mp4";

export default function Description() {
  return (
    <>
      <header>
        <a href="./main.html" class="logo">
          Maria<span>Fernanda</span>
        </a>
      </header>
      <div class="banner">
        <video
          src={video}
          autoplay={true}
          muted
          loop
          type="mp4"
        />

网页包：

{
        test: /\.mp4$/,
        use: [
          {
            loader: "file-loader",
            options: {
              name: "[name].[ext]",
              outputPath: "video",
            },
          },
        ],
      },

控制台错误 react-dom.development.js:67 警告：无效 DOM 属性 autoplay。您是说 autoPlay 吗？在视频在 div 在描述

Answer 1

根据错误，我认为你应该使用这个：

<video
  src={video}
  autoPlay={true}
  muted
  loop
  type="mp4"
/>

这里，autoplay改为autoPlay。大多数属性都需要在 React jsx 中以驼峰式方式传递。尽管有几个例外，例如数据属性 data-*

那些不需要以驼峰格式传递。同样适用于 aria 属性 aria-*

来自 React 的示例 docs：

<input
  type="text"
  aria-label={labelText}
  aria-required="true"
  onChange={onchangeHandler}
  value={inputValue}
  name="name"
/>

视频自动播放不适用于 React。帮我？

Video autoplay not working with React. Help me?

javascript

autoplay

reactjs

webpack