小技巧

• className 拼接

cnpm i classnames —save

<ul className="nav nav-pills">
      {
        files.map(file => {
          const fClassName = classnames({
            'nav-link': true,
            'active': file.id === activeId
          })
          return (
            <li className="nav-item" key={file.id}>
              <a href="#"
                className={fClassName}
                onClick={(e)=>{e.preventDefault(); onTabClick(file.id)}}
              >
                {file.title}
              </a>
            </li>
          )
        })
      }
</ul>

• 使用scss

cnpm i node-sass —save

• 使用md编辑器

cnpm i —save react-simplemde-editor

在根函数中创建的 依赖性的函数会随着变量改变而改变， 如果某组件没有改变， key变量

生成唯一id

• cnpm i —save uuid

  import uuidv4 from 'uuid/v4'
  let newId = uuidv4()

把数组循环找id 改为 map格式 id为key

{
    '1': {...File}
}

• 新建个公用函数 处理

const newFile = {...files[id], body: value}
// 变量当key  用中括号
setFiles({...files, [id]: newFile})

electron 导入 fs

const fs = window.require('fs').promises

获取文件路径

app.getPath(name)

数据持久化

cnpm i electron-store --save
const Store = window.require('electron-store')
const store = new Store()
store.set('name', 'Amy')
console.log(store.get('name'))
store.delete('name')

页面不渲染

delete files[id]
setFiles(files)
 使用下面的
setFiles({...files})

关闭拦截

 mainWindow.on('close', (e) => {
    e.preventDefault()
    let choice = dialog.showMessageBox(mainWindow, {
      type: 'info',
      title: 'Information',
      message: '确定要关闭吗？',
      buttons: ['最小化','直接退出']
    });
    choice.then(res => {
      if (res.response === 1) {
        mainWindow = null
        app.exit()
      }
      // if (res.response === 0) {
      //   mainWindow.maximize()
      // }
    })
    // const choice = dialog.showMessageBoxSync(this, {
    //   type: 'info',
    //   title: 'Information',
    //   defaultId: 0,
    //   message: '确定要关闭吗？',
    //   buttons: ['最小化','直接退出']
    // })
    // if (choice === 0) {
    //   e.preventDefault()
    // }
  })

• 单例

  app.requestSingleInstanceLock()  只打开一个窗口

• 文档

https://umbrella22.github.io/electron-vue-template-doc/Overview/essentials/build.html#构建出web版本