标签:col bsp react link reload out ext exp path
React 与 electronjs 安装及运行请百度。
electronjs中引入 React
// electronjs 目录下的 main.js,loadFile修改为 loadURL // mainWindow.loadFile(‘index.html‘) mainWindow.loadURL("http://localhost:3000/");
// electronjs 目录下的 preload.js 最底下追加 // load Api 需要什么 api 就引入什么api const loadApi = [ ‘electron‘, // 引入 electron ‘mysql‘, // 引入 mysql ]; loadApi.map((item)=>{ global[item] = require(item); });
React中调用 preload.js文件中暴露的 api
import React,{Component} from ‘react‘;
import { HashRouter as Router, Link, Route } from ‘react-router-dom‘;
import ‘./App.css‘;
import { Button } from ‘element-react‘;
const Home = () => (
<div>
<h2>Home</h2>
</div>
)
const About = () => (
<div>
<h2>About</h2>
</div>
)
const Product = () => (
<div>
<h2>Product</h2>
</div>
)
// const electron = window.electron
class App extends Component {
Test(){
}
render(){
const { electron } = window.electron;
// console.log(window.electron);
return (
<Router>
<div className="App">
<Link to="/">Home</Link>
<Link to="/About">About</Link>
<Link to="/Product">Product</Link>
<hr/>
<Route path="/" exact component={Home}></Route>
<Route path="/about" component={About}></Route>
<Route path="/product" component={Product}></Route>
</div>
</Router>
)
}
}
export default App;
React + electronjs 实现桌面软件开发引入 electronjs 及 node api
标签:col bsp react link reload out ext exp path
原文地址:https://www.cnblogs.com/xiaqiuchu/p/12386282.html