Как узнать свойства обозревателя mobx в консоли разработчика браузера? - PullRequest
0 голосов
/ 20 декабря 2018

В проекте, в котором я работаю, внедрение зависимостей используется очень широко.

Есть такой код

type BigWidget = {
   title: string,
}


const AProps = {
  b: BigWidget
}

class A extends React.Component<AProps> {
  ...
}

...
const a = <A b={observerB} />

Проблема с пропеллером b выше в том, что он может быть созданво многих отношениях

import * as mobxReact from 'mobx-react';
const observerB = mboxReact.observer( { title }: { title: string } ) => {...}

или

const anotherObserverB = mboxReact.observer( { title, extraFunction }:
    { title: string, extraFunction:() => void } ) => {...}

Я хочу иметь возможность определить, какой объект был передан в пропеллер b.Легко ли сказать, например, что у наблюдателя есть опора extraFunction или нет в консоли разработчика?

В настоящее время, если я набираю a в консоли, это все, что я вижу

enter image description here

и это не очень информативно.

1 Ответ

0 голосов
/ 20 декабря 2018

Упрощенный код, который будет компилироваться:

export type AProps = {
  b: any
}

export class A extends React.Component<AProps> {
  render() {
    return <div />
  }
}

const observerB = observer(() => { return <div /> });

const a = <A b={observerB} />

Теперь вы хотите узнать, каково значение b, переданное a.Его можно приобрести под реквизиты:

console.log(a.props['b'] === observerB); // True

Полный код

export type AProps = {
  b: any
}

export class A extends React.Component<AProps> {
  render() {
    return <div />
  }
}

const observerB = observer(() => { return <div /> });

const a = <A b={observerB} />
console.log(a); // What you have 
console.log(a.props['b'] === observerB); // True
...