山东大学软件学院创新实训周报（二）

本周任务：基本页面的设计

目前页面处于搭建和debug阶段

目前界面如下（仅供测试，不代表最终成品）：

开发中的问题

mockData.js文件无法加载导致fetchMockData方法失效

报错原因

export const fetchMockData = (query) => {
    return mockNotes.filter(note => 
      note.title.includes(query) || 
      note.content.includes(query)
    )
  }

我的 mockData.js 使用了 export 语法，但 Electron 渲染进程默认是不支持 ES6 import/export 语法的

解决方案：

把 mockData.js 作为普通脚本引入
 
<script src="mockData.js"></script>

然后在 mockData.js 里这样定义：

function fetchMockData(query) {
    return mockNotes.filter(note =>
        note.title.includes(query) ||
        note.content.includes(query)
    );
}

// 把 fetchMockData 绑定到 window，使其他脚本可以使用
window.fetchMockData = fetchMockData;

.loading-indicator加载状态函数未显示

解决方法：

函数定义错误,修改成如下

.loading-indicator {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 3px solid rgba(0,0,0,0.1);
  border-top-color: #2196F3;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

.hidden {
  display: none;
}

其他完成工作：

优化对话框、优化问答功能