2016-07-31 35 views
0

React-ecma6 Dosent scheinen Getter ohne Setter zu definieren Gibt es eine Möglichkeit, eine Getter-Methode zu definieren und einen Wert durch eine andere Methode zu ändern? definieren Getter ohne Setter ecma6 - reagieren

import React from 'react'; 
export default class GetterOnly extends React.Component { 
    constructor(props) { 
     super(props); 
     this._is_on = false; 
    } 

    on() { 
     this._is_on = true; 
    } 

    get is_on() { 
     return this._is_on; 
    } 

    render() { 

    } 
} 
var _getter = new GetterOnly() 
_getter.on(); 

Uncaught TypeError: Cannot set property is_on of #GetterOnly which has only a getter

patchProperty @ makeAssimilatePrototype.js:21 (anonymous function) @ makeAssimilatePrototype.js:52 (anonymous function) @ makeAssimilatePrototype.js:51 reconcileWithStoredPrototypes @ makeAssimilatePrototype.js:50 assimilatePrototype @ makeAssimilatePrototype.js:63 patchReactClass @ makePatchReactClass.js:40 makeHot @ makeMakeHot.js:33 makeExportsHot @ makeExportsHot.js:44 (anonymous function) @ GetterOnly.js:139 (anonymous function) @ GetterOnly.js:139 (anonymous function) @ GetterOnly.js:140 (anonymous function) @ app.js:5062 webpack_require @ app.js:556 fn @ app.js:87 (anonymous function) @ page.js:35 (anonymous function) @ page.js:81 (anonymous function) @ page.js:82 (anonymous function) @ app.js:5056 webpack_require @ app.js:556 fn @ app.js:87 (anonymous function) @ Routes.js:19 (anonymous function) @ Routes.js:52 (anonymous function) @ Routes.js:53 (anonymous function) @ app.js:4438 webpack_require @ app.js:556 fn @ app.js:87 (anonymous function) @ makoVOD.js:19 (anonymous function) @ makoVOD.js:62 (anonymous function) @ makoVOD.js:63 (anonymous function) @ app.js:1042 webpack_require @ app.js:556 fn @ app.js:87 (anonymous function) @ multi_main:3 (anonymous function) @ app.js:586 webpack_require @ app.js:556 (anonymous function) @ app.js:579 (anonymous function) @ app.js:582

+2

Nein, es ist erlaubt - es ist kein Syntaxfehler. Die Fehlermeldung weist darauf hin, dass etwas versucht hat, '. Überprüfen Sie die Stack-Ablaufverfolgung des Fehlers, um festzustellen, woher es stammt. – Bergi

+0

Dies ist eine vereinfachte Version des Codes, und es zeigt immer noch einen Fehler: 'importieren Reagieren von 'reagieren'; Klasse GetterOnly erweitert React.Component { \t Konstruktor (Requisiten) { \t \t Super (Requisiten); \t \t}; \t \t get_on() { \t \t zurückgeben this._is_on; \t}; \t render() { \t}; } Export Standard GetterOnly ' –

+0

Dies scheint ein Problem mit dem Import/Export-Module zu sein –

Antwort

-4

Das Problem ist, dass Sie on als Funktion sind aufgerufen wird. Ein Getter macht die Funktion aussehen wie eine Eigenschaft:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get

Damit letzte Zeile sollte _getter.on statt _getter.on() sein.

Auch dass _is_on Variable privat zu machen, können Sie es außerhalb der Klasse definieren können, etwa so:

import React from 'react'; 

let _is_on = false; 

export default class GetterOnly extends React.Component { 
    constructor(props) { 
     super(props); 
    } 

    on() { 
     _is_on = true; 
    } 

    get is_on() { 
     return _is_on; 
    } 

    render() { 

    } 
} 
var _getter = new GetterOnly() 
_getter.on; 

Jetzt niemand aber die Klasse können die Variable bearbeiten.

+1

'on' ist in der Tat in der Tat und sollte aufgerufen werden. 'let _is_on = false;' teilt dieses Flag zwischen allen Instanzen. –

0

Das Problem Wasent React/Es6 Verantwortung. Es scheint von dem Modul nodejs - webpack.hot ... zu kommen, mit dem ich den Code automatisch übersetzt habe. Ich habe auf vesion: 2.0.0-alpha aktualisiert und der Fehler ist verschwunden. ist ein bekanntes Problem in - https://github.com/gaearon/react-hot-loader/issues/131