React Native扩展多个组件与createClass

Question

I've seen many tutorials with code that suggests doing something like the following:

var App = React.createClass({
    someFunction() { .. },
    render() { return(); },
});
var Lication = React.createClass({
    someOtherFunction() { .. },
    render() { return(); },
});

...but I've been using the ES6 syntax:

class App extends Component {
    someFunction() { .. }
    render { return(); }
}

Where do I create the Lication class? Right below the App class? Or does it need its own file, and imported into the main file with something like:

var Lication = require('./Lication');

I have yet to see code that uses multiple classes.

Answer 1

Where do I create the Lication class? Right below the App class? Or does it need its own file?

Using ES6 classes or React's createClass function makes no rules about where you have to define them. Both can be defined one above another or in different files. The one way using ES6 classes does affect code order is with hoisting :

An important difference between function declarations and class declarations is that function declarations are hoisted and class declarations are not. You first need to declare your class and then access it.

Which means something like this is invalid:

var l = new Lication(); // ReferenceError

class Lication {}

---

As far as splitting the code into files or not, this is valid:

class App extends React.Component {
  // ...
}

class Lication extends React.Component {
  // ...
}

And so is this:

class App extends React.Component {
  // ...
}

var Lication = require('path-to-lication-class');

Where Lication would be defined in its own file and exported out:

class Lication extends React.Component {
  // ...
}

module.exports = Lication;

The last example is essentially equivalent to:

class App extends React.Component {
  // ...
}

var Lication = class Lication extends React.Component {
  // ...
}

Splitting into files is done to achieve modularity in your code, where individual components are split into files (or modules) so they can be easier to maintain and the whole app isn't crowded into one giant file while developing but combined later when deploying.

Here's a useful read on classes