Можно ли использовать MobX без React? - PullRequest
Новая
       16

Можно ли использовать MobX без React?

0 голосов
/ 26 апреля 2018

Мне нравится MobX. Я хотел бы использовать его в родном JavaScript. Я попытался добавить CDN https://cdnjs.com/libraries/mobx Затем я попытался написать класс с синтаксисом MobX: 

class MyStore {
  @observable data = 'foo'
}
const myStore = new MyStore();

но я получаю ошибки: 

SyntaxError: illegal character

для @ и: 

ReferenceError: exports is not defined

из mobx.js файла.

Так что, кажется, это невозможно без React и без Blunding / Transpiler, не так ли? Если нет, есть ли альтернативы?

Спасибо!

Ответы [ 3 ]

0 голосов
/ 26 апреля 2018

Как сказал @ somebody235, это возможно.

, чтобы показать вам, вот пример без какой-либо реакции в нем: https://jsfiddle.net/Lrt9pky4/

Это код, хотя я не могу включить декораторы в SO, поэтому приведенный ниже пример не работает. ссылка работает. 

const {observable, computed, autorun} = mobx;
class MyStore {
  @observable data = 'foo'
}
const myStore = new MyStore();      
autorun(()=> {
console.log(myStore.data);
document.getElementById('log').innerHTML += myStore.data + "<br />"
})

myStore.data = 'bar'
<script src="https://unpkg.com/mobx@3/lib/mobx.umd.js"></script>
<body>
  Log
  <hr/>
  <div id="log">
  </div>
</body>

Вы можете использовать методы автозапуска и наблюдения / перехвата для получения уведомлений об изменениях, но вам придется самостоятельно писать весь другой код. (чтобы правильно реагировать на эти изменения, намеревался фан).

0 голосов
/ 26 апреля 2018

Нет необходимости в декораторах. Вы можете попробовать подход Mobx 4: 

import { decorate, observable} from "mobx"
class MyStore {
  data = 'foo'
}
decorate(City, {
    data: observable,
})
const myStore = new MyStore();

подробнее здесь https://medium.com/@mweststrate/mobx-4-better-simpler-faster-smaller-c1fbc08008da

0 голосов
/ 26 апреля 2018

Да, вы можете использовать MobX без React, но в своем примере вы использовали синтаксис декораторов, которые принадлежат ES.Next и не поддерживаются браузером изначально и требуют транспилятора (например, Babel).

Если вы хотите использовать MobX непосредственно в браузере без декораторов, эти инструкции могут быть вам полезны: https://mobx.js.org/best/decorators.html

...