JavaScript関数の構文ですか？ <a href="https://github.com/nikgraf/webvr-experiments" rel="nofollow noreferrer">this ReactVR example</a>で輸出デフォルト（{...}）=>（<View .... >）

Question

、私はこの構文を参照してください。

export default ({ style }) => (
    <View style={style}> ... 
) 

を私はいくつかのES6 /活字を行っているが、これは私には何のように見えるしていません。

どうしますか？ ReactやJSX固有のものですか？ （私はこれら2つの新しい、検索したが見つかりませんでした）

また、どのように通常のクラスベースのコンポーネントに変換されますか？

Answer 1

コードはstateless functional componentをエクスポートしています。

匿名です。パラメータのobject destructuringを受け取ったes6 arrow functionです。

はまた、次のように記述できます。

const YourComponent = props => { 
    const { style } = props; 
    return (
    <View style={style}>... 
); 
}; 
export default YourComponent; 

は、あなたがこれを行うことができ、クラスベースのコンポーネントに変換するには：

import React, { Component } from 'react'; 
export default class YourComponent extends Component { 
    render() { 
    const { style } = this.props; 
    return (
     <View style={style}>... 
    ); 
    } 
}