Question

我是新手做出反应并试图改变旋转木马的箭头图像。该文件说我可以改变prev，下一个带装饰的图标。但是，我不知道在哪里使用它。

 var Decorators = [{
  component: React.createClass({
    render() {
      return (
         <div>
            <i className="fa fa-chevron-circle-left fa-3x"
                onClick={this.props.previousSlide} aria-hidden="true"></i>
          </div>
      )
    }
  }),
  position: 'CenterLeft',
  style: {
    padding: 20
  }
}];

有人有这方面的示例代码吗？

Answer 1

旋转木马组件上有“装饰器”属性;将它设置为您创建的自定义Decorators数组：

<Carousel decorators={Decorators}>...</Carousel>

完整示例

'use strict';

    var React = require('react');

    var Carousel = require('nuka-carousel');

    const App = React.createClass({
      mixins: [Carousel.ControllerMixin],
      render() {

     var Decorators = [{
      component: React.createClass({
        render() {
          return (
             <div>
                <i className="fa fa-chevron-circle-left fa-3x"
                    onClick={this.props.previousSlide} aria-hidden="true"></i>
              </div>
          )
        }
      }),
      position: 'CenterLeft',
      style: {
        padding: 20
      }
    }];
        return (
          <Carousel decorators={Decorators}>
            <div>Slide 1</div>
            <div>Slide 2</div>
            <div>Slide 3</div>
          </Carousel>
        )
      }
    });

    module.exports = App;

React Nuka滑块放置装饰器的位置？

1 个答案: