来做个能在电脑上自动定时休息的软件吧！

2023-12-13 09:29:11

定时提醒软件的必要性

现在的人们，生活节奏普遍很快。每天坐在电脑前工作、学习的人，有成千上万。长时间对着电脑屏幕，眼睛很容易感到疲劳、干涩、视力下降等问题。

定时提醒软件有什么用？

定时提醒软件可以帮助我们，在长时间使用电脑后，提醒我们适当休息一下，避免眼睛疲劳、视力下降等问题。

如何制作定时提醒软件

首先，我们要搭建一个项目。

# 使用Vue3 + Ts + Electron
vue create project-name --template @vue/cli-plugin-electron-builder

然后，我们要安装必要的依赖。

# 安装Electron
npm install electron

然后，我们要在main.js文件中，添加以下代码：

// 导入Electron
const electron = require('electron')

// 创建一个Electron窗口
const win = electron.BrowserWindow.create({
  width: 800,
  height: 600
})

// 加载index.html文件
win.loadFile('index.html')

然后，我们要在index.html文件中，添加以下代码：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  
</head>
<body>
  <div id="app"></div>
  <script src="main.js"></script>
</body>
</html>

然后，我们要在App.vue文件中，添加以下代码：

<template>
  <div>
    <h1>定时提醒软件</h1>
    <button @click="start">开始</button>
    <button @click="stop">停止</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      interval: null
    }
  },
  methods: {
    start() {
      this.interval = setInterval(() => {
        alert('休息一下吧！')
      }, 1000 * 60 * 30)
    },
    stop() {
      clearInterval(this.interval)
    }
  }
}
</script>