TypeScript observable.box方法代码示例

 public constructor(props: KeyToYubiKeyProps) {
   this.fingerprint = props.fingerprint;
   this.card_id = props.card_id;
   this.slot_id = observable.box(props.slot_id);
   this.passphrase = observable.box(props.passphrase);
   this.admin_pin = props.admin_pin || new Pin();
 }

 public constructor(props: PinProps = {}) {
   if (props.pin) {
     this.pin = observable.box(props.pin);
   } else if (props._pin) {
     this.pin = props._pin;
   } else {
     this.pin = observable.box('');
   }
   this.match = props.match || new RegExp(PinDefaultRegex);
 }

 constructor(val?: boolean|NestedFlag, value = false) {
   super('NestedFlag');
   this.children = [];
   if (typeof(val) == 'boolean' || !val) {
     this.parent = undefined;
     this.value = observable.box(!!val);
   } else {
     this.parent = val;
     this.parent.children.push(this);
     this.value = observable.box(undefined);
   }
 }

 constructor(warrent: Warrent/* , contentReg = '.' */) {
   super('ViewWarrent');
   this.warrent = warrent;
   // this.contentReg = contentReg;
   this._approved = observable.box(false);
   // this.min = 0;
   // this.max = 0;
 }

 public constructor(v: Date, e: string) {
   super('DateValue');
   this.errText = e;
   this.date = observable.box(undefined);
   this.date.observe(action((chg: IValueDidChange<Date>) => {
     const f = format_date(chg.newValue);
     this.formatDate.set(f);
     // chg.newValue.setHours(0);
     // chg.newValue.setMinutes(0);
     // chg.newValue.setSeconds(0);
     // chg.newValue.setMilliseconds(0);
     // console.log('observe fix', chg.newValue);
   }));
   this.formatDate = observable.box(undefined);
   this.formatDate.observe(action((chg: IValueDidChange<string>) => {
     this.date.set(new Date(chg.newValue));
   }));
   action(() => this.formatDate.set(format_date(v)))();
 }

 constructor(warrents: Warrents, diceWares: DiceWare[], smartCardId: string) {
   this.warrents = warrents;
   this.smartCardId = observable.box(smartCardId);
   this.readOnly = new NestedFlag(false);
   this.common = new SimpleKeyCommon(warrents, this.readOnly);
   this.passPhrase = PassPhrase.createDoublePasswords(8, new Warrents(this.warrents.map(w => w)), diceWares,
     CharFormat.wildcard(), 'PassPhrase error', ' ', 1);
   this.adminKey = PassPhrase.createPerWarrent(new Warrents(this.warrents.map(w => w)), null,
     CharFormat.decNumber(), 'adminpin error', '', 8, 8);
   const me = (new Warrents()).add(warrents.first());
   this.userKey = PassPhrase.createPerWarrent(me, null, CharFormat.decNumber(), 'userPin Error', '', 6, 8);
 }

 constructor(warrents: Warrents, errText: string, minmaxs: MinMax, diceWares: DiceWare[]) {
   super('DoublePassword');
   // console.log('approved', this.objectId, approved);
   // this.approved = new BooleanValue('').set(DoublePassword.approveIfJustOne(warrents));
   this.first = new PasswordControl(minmaxs, '');
   this.second = new PasswordControl(minmaxs, '');
   if (diceWares && diceWares.length) {
     this.diceWares = diceWares;
     this.currentDiceWare = this.diceWares[0];
     // console.log('DoublePassword', this.objectId(), this);
     this.diceValue = new StringValue(
           new RegExp(`^[1-6]{${this.diceWare().dicesCount()},${this.diceWare().dicesCount()}}$`),
           'dices should be between 1-6');
   }
   this._readOnly = observable.box(false);
   this._readable = observable.box(false);
   // this.passPhrase = passPhrase;
   this.warrents = new ViewWarrents();
   warrents.forEach(w => this.warrents.add(new ViewWarrent(w)));
   this.passwordInputType = observable.box(this.readOnly ? InputType.Password :
     !this.readable ? InputType.Password : InputType.Text);
 }

 public constructor(match: RegExp, errorText: string, value = '') {
   super('StringValue');
   this.match = match;
   this._value = observable.box(value ? value : '');
   this.errorText = errorText;
 }

 public constructor(props: RequestAsciiProps) {
   this.action = props.action;
   this.passphrase = observable.box(props.passphrase || '');
   this.fingerprint = props.fingerprint;
 }

import { observable } from 'mobx';

// Convert "evented" selection API into "observable" one so we can easily use it in component logic.
// TODO -- this seems a bit weird. Boxing the collection directly doesn't seem to work, unless I'm missing something.
const selection = observable.box({ current: window.getSelection() }, { deep: false });
document.addEventListener('selectionchange', () => selection.set({ current: window.getSelection() }));

// Expose read-only access
export const getSelection = () => selection.get().current;

/**
 * Focuses given node and moves selection to the end of it, so typed characters will be appended to the existing content.
 * Will also unselect anything else selected on the screen.
 *
 * @param {Node} el HTML Node (element, text node, etc.)
 */
export const focusEnd = (el: Node) => {
  const sel = getSelection();

  sel.removeAllRanges();      // in case there is other stuff selected, unselect it.
  sel.selectAllChildren(el);  // Select the full node
  const range = sel.getRangeAt(0);
  range.collapse(false);      // Collapse range to the end
  // Note -- sel.collapseToEnd(); works great, but not supported in as many browsers as range.collapse
};