基本Reactjs - 函數出錯

Question

我正在學習Reactjs並嘗試同時使用一些ES6功能。 這裏有一個reactjs組件，它給我一個錯誤：

import React from "react"; 

export default class Features extends React.Component { 

    function myFunc(x, y=5) { 
    return x * y; 
    } 

    render() { 

    return (
     <div> 
     <p>This is number {this.props.feature}</p> 
     {this.myFunc(4,1)} 
     </div> 
    ); 
    } 
} 

出於某種原因，它不喜歡的函數聲明。

我試圖函數聲明兩種語法：

myFunc: function (x, y=5) {...} 

和

function myFunct(x, y=5) {...} 

爲什麼我的IDE高亮顯示「功能」和「myFunc的」之間的空間，它拋出一個錯誤：

./src/js/components/Features.js 
Module build failed: SyntaxError: X:/projects/react-gallery/src/js/components/Features.js: Unexpected token (5:11) 
    3 | export default class Features extends React.Component { 
    4 | 
> 5 | function myFunc(x, y=5) { 
    |   ^
    6 |  return x * y; 
    7 | } 

Answer 1

擺脫function關鍵字。 方法是ES6類只使用shorthand符號定義，因此該方法的定義應該是這樣的：

export default class Features extends React.Component { 

    myFunc(x, y=5) { 

    } 

    render() { 

    } 
} 

Answer 2

你不需要詞功能。您可以有

import React from "react"; 

export default class Features extends React.Component { 

myFunc(x, y=5) { 
    return x * y; 
} 

render() { 

    return (
     <div> 
     <p>This is number {this.props.feature}</p> 
     {this.myFunc(4,1)} 
    </div> 
); 
} 
}