How to use the dotnetify.react function in dotnetify

To help you get started, we’ve selected a few dotnetify examples, based on popular ways it is used in public projects.

github dsuryd / dotNetify / DevApp / client / app / views / examples / react / SimpleList.js View on Github external
constructor(props) {
    super(props);
    this.state = { Employees: [], newName: '' };

    // Connect this component to the back-end view model.
    this.vm = dotnetify.react.connect('SimpleListVM', this);

    // Set up function to dispatch state to the back-end.
    this.dispatch = state => this.vm.$dispatch(state);

    this.dispatchState = state => {
      this.setState(state);
      this.vm.$dispatch(state);
    };
  }
github dsuryd / dotNetify / DevApp / client / app / views / examples / react / HelloWorld.js View on Github external
constructor(props) {
    super(props);
    this.state = { FirstName: '', LastName: '' };

    // Connect this component to the back-end view model.
    this.vm = dotnetify.react.connect('HelloWorldVM', this);

    // Set up function to dispatch state to the back-end.
    this.dispatchState = state => this.vm.$dispatch(state);
  }
github dsuryd / dotNetify-Elements / DevApp / src / dotnetify-elements / _internal / VMContextStore.js View on Github external
removeOrphan(vmId) {
      // Clear any existing connection to the same view model.
      dotnetify.react.getViewModels().filter(vm => vm.$vmId === vmId).forEach(vm => vm.$destroy());
   }
}
github dsuryd / dotNetify / DevApp / client / app / views / DataFlow.js View on Github external
constructor() {
    super();
    this.state = { ListItems: [], selected: 0 };
    this.vm = dotnetify.react.connect('MasterDetails.MasterList', this);
  }
github dsuryd / dotNetify / DevApp / client / app / views / examples / react / SecurePage.js View on Github external
constructor(props) {
    super(props);
    this.state = {};

    if (this.props.accessToken) {
      let authHeader = { Authorization: 'Bearer ' + this.props.accessToken };
      this.vm = dotnetify.react.connect('AdminSecurePageVM', this, { headers: authHeader, exceptionHandler: ex => {} });
    }
  }
github dsuryd / dotNetify / Demo / React / HelloWorld.WebPack / src / HelloWorld.js View on Github external
constructor(props) {
    super(props);
    this.state = { Greetings: '', ServerTime: '' };

    dotnetify.react.connect('HelloWorld', this);
  }
github dsuryd / dotNetify-Elements / DevApp / src / dotnetify-elements / _internal / VMContextStore.js View on Github external
connect(vmId, options, onStateChange) {
      vmId = this.host.vmContext ? `${this.host.vmContext.vmId}.${vmId}` : vmId;
      if (!vmId) throw new Error("'vmId' is required by connect()");

      this.removeOrphan(vmId);
      this.vm = dotnetify.react.connect(vmId, this.host, {
         setState: state => {
            this.setState(state);
            this.notifyStateChange(state, onStateChange);
         },
         ...options
      });

      this.vmId = vmId;
      return this.vm;
   }
github dsuryd / dotNetify / DevApp / client / app / views / examples / components / Example.js View on Github external
render() {
    const { framework } = this.state;
    const example = framework === 'Knockout' ? this.props.ko : framework === 'Vue' ? this.props.vue : this.props.react;
    if (!example) dotnetify.react.router.pushState({}, null, '/core/overview');

    return (
      <RenderExample vm={this.props.vm} vmOptions={{ vmArg: { Framework: framework } }} key={framework}>
        {example}
      </RenderExample>
    );
  }
}
github dsuryd / dotNetify / DevApp / client / app / views / DataFlow.js View on Github external
componentDidUpdate() {
    if (this.state.framework === 'Knockout') dotnetify.react.router.pushState({}, null, '/core/overview');
  }
  render() {
github dsuryd / dotnetify-react-demo / Promise / src / Promise.jsx View on Github external
constructor(props) {
        super(props);
        
        dotnetify.offline = true;
        this.vm = dotnetify.react.connect(this.props.viewModel, this);
    }
    componentWillUnmount = () => this.vm.$destroy();