reactjs - React-Elastic-Carousel 自定义箭头

Question

我想获得有关将自定义箭头添加到我的 React 旋转木马的帮助，但我收到“类型”未定义 no-undef 的错误。
有人可以告诉我我做错了什么吗？最好是针对当前情况的解决方案。

谢谢

import Carousel, { consts } from 'react-elastic-carousel';
import LeftArrow from './Assets/Group 1316.svg'
import RightArrow from './Assets/Group 1317.svg'

export default function BootcampNew (props) {

const breakPoints = [
        { width: 1, itemsToShow: 1 },
        { width: 550, itemsToShow: 2 },
        { width: 768, itemsToShow: 3 },
        { width: 900, itemsToShow: 4 },
      ];
type === consts.PREV;

    const myArrow = ({type,onClick, isEdge}) => {
        const pointer = type === consts.PREV ? {LeftArrow} : {RightArrow}
        return(
            <Button onClick={onClick} disabled={isEdge}>{pointer}</Button>
        )
      }

<Carousel
     renderArrow={myArrow}
     breakPoints={breakPoints}
     pagination={false}>
     <CourseCard/>
<Carousel/>

Answer 1

你不能输入 type === consts.PREV;没有任何定义，它的唯一用途，在这种情况下，是在一个条件内，另一件事是你不返回功能组件正在呈现的内容，下面的代码应该可以解决问题。

import Carousel, { consts } from 'react-elastic-carousel';
import LeftArrow from './Assets/Group 1316.svg'
import RightArrow from './Assets/Group 1317.svg'

function myArrow({ type, onClick, isEdge }) {
    const pointer = type === consts.PREV ? {LeftArrow} : {RightArrow}
    return (
      <button onClick={onClick} disabled={isEdge}>
        {pointer}
      </button>
    )
  }

export default function BootcampNew (props) {


const breakPoints = [
        { width: 1, itemsToShow: 1 },
        { width: 550, itemsToShow: 2 },
        { width: 768, itemsToShow: 3 },
        { width: 900, itemsToShow: 4 },
      ];
      
      return (
        <Carousel renderArrow={myArrow} breakPoints={breakPoints} pagination={false}>
            <CourseCard/>
        </Carousel>
      );

}