将 Material-ui 与 Electron 结合使用

Question

I am building out an electron app with React and trying to use Material-UI for the UI elements. I added a datepicker and timepicker to a component and the input shows up in the electron app, however when you click on it, nothing happens. Not sure what I'm missing in order to get this to work correctly

Component :

import React, { Component } from 'react';
import DatePicker from 'material-ui/DatePicker';
import TimePicker from 'material-ui/TimePicker';

export default class Schedule extends Component {
  render() {
    return (
      <div>
        Pick a date :
        <DatePicker id="date"/>
        and time :
        <TimePicker id="time"/>
      </div>
    )
  }
}

index.js :

import 'babel-polyfill'; // generators
import React from 'react';
import { render as renderReact } from 'react-dom';
import debounce from 'debounce';
import configureStore from './store/configureStore';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import injectTapEventPlugin from 'react-tap-event-plugin';

injectTapEventPlugin();

const state = JSON.parse(localStorage.getItem('state'));
const store = configureStore(state || {});

let App = require('./components/app').default;
const render = (Component) => {
  renderReact(<MuiThemeProvider><Component {...store} /></MuiThemeProvider>, document.getElementById('root'));
};

if (module.hot) {
  module.hot.accept('./components/app', function() {
    let newApp = require('./components/app').default;
    render(newApp);
  });
}

const saveState = debounce(() => {
  localStorage.setItem('state', JSON.stringify(store.getState()));
}, 1000);
store.subscribe(() => {
  saveState();
  render(App);
  if (process.env.ENV === 'development') {
    console.log('state', store.getState());
  }
});
store.dispatch({ type: 'APP_INIT', store });

Answer 1

In your app.js, you need to import and execute the following plugin:

const injectTapEventPlugin = require('react-tap-event-plugin');
injectTapEventPlugin();