Question

我正在尝试使用nuka轮播进行我正在进行的反应项目。

http://kenwheeler.github.io/nuka-carousel/#/

我是全新的反应，我无法弄清楚如何设置旋转木马。我已经使用入门套件和步骤运行了一个反应项目，如下所述：

https://facebook.github.io/react/docs/getting-started.html

然而，在这一点上，我不知道如何启动旋转木马。在nuka网站上，我看到了示例代码：

'use strict';

var React = require('react');

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

const App = React.createClass({
  mixins: [Carousel.ControllerMixin],
  render() {
    return (
      <Carousel>
        <img src="http://placehold.it/1000x400/ffffff/c0392b/&text=slide1"/>
        <img src="http://placehold.it/1000x400/ffffff/c0392b/&text=slide2"/>
        <img src="http://placehold.it/1000x400/ffffff/c0392b/&text=slide3"/>
        <img src="http://placehold.it/1000x400/ffffff/c0392b/&text=slide4"/>
        <img src="http://placehold.it/1000x400/ffffff/c0392b/&text=slide5"/>
        <img src="http://placehold.it/1000x400/ffffff/c0392b/&text=slide6"/>
      </Carousel>
    )
  }
});

module.exports = App;

但是我在哪里放这个代码？我尝试将它放入helloworld.js（启动文件，如反应入门页面所述），但是抛出了一个错误，需要是未定义的。这是否意味着我需要先运行节点服务器以便可以使用require？如果是这样，除了设置反应项目之外，如何设置服务器？

Answer 1

你有一个以一种风格构建的组件，在实际到达你的页面之前需要某种编译步骤。我查看了nuka-carousel代码库，它希望在require模块中使用，因此没有一种真正快速而又脏的方法将其转换为不使用节点。

我建议使用Yeoman为你做一个反应应用程序。熟悉不同组件如何相互作用。使用'grunt dev'运行开发服务器。然后，添加nuka-carousel库并尝试以与示例类似的方式呈现上面的组件。

如何启动react.js的nuka轮播组件？

1 个答案: