javascript - 使用 MobX 验证对象的属性

Question

假设我有一堂这样的课:

class Foo {
  @observable url;
}

如果 url 属性不是有效的 URL，我想记录一条警告。我可以使用 autorun 来监听 url 属性。当它发生变化并且不再是有效的 URL 时，我可以记录警告。有更好的办法吗？

Answer 1

您可以使用observe or intercept 。在拦截的情况下，如果网址无效，您甚至可以取消修改。

import {intercept} from 'mobx'

class Foo {
  @observable url;
}

const foo = new Foo();

intercept(foo, 'url', change => {
  const url = change.newValue;

  if (!isUrl(url)) {
    console.log(`'${url}' is invalid url`);
    return null; // cancel modification
  }
});

还有来自mobx-decorators的@observe和@intercept可能对你有用。

import {intercept} from 'mobx-decorators'

class Foo {
  @intercept(change => {
    const url = change.newValue;

    if (!isUrl(url)) {
      console.log(`'${url}' is invalid url`);
      return null; // cancel modification
    }
  })
  @observable url;
}