Day17 工具条设置单元格样式

返回目录

 

以下知识源码位置: [Git:  https://gitee.com/zhouweng/mini_sheet  version=fdcf5ba1923fd8e193f3720ce9dfc6fdcc68bd36]

源代码回滚版本，参考这里[ https://blog.youkuaiyun.com/u010593516/article/details/113767587 ]

 

上一次的内容，项目支持了单元格的各种样式，今天我们增加工具栏以及键盘快捷键的单元格样式设置。

可以看到，我们可以通过工具栏或者键盘快捷键，两种方式设置单元格的样式。

 

1.新增文件

1.1.controllers/menuButton.js: 之前我们只是把工具栏显示在页面上，具体的功能并没有实现。未来我们将在这个js文件里面，实现工具栏按钮的功能。

  包括下面两个对外方法：

  initialMenuButton()：初始化工具栏各个按钮的事件响应；

  menuButtonFocus()：根据选择的单元格，反向更新工具栏的选择状态；

 

2.修改文件

2.1.core.js: 在页面初始化，调用上面menuButton.js的initialMenuButton()方法，实现工具栏的事件响应初始化；

2.2.chooseOneCell.js: 在选择单元格后，调用menuButtonFocus()刷新工具栏对应按钮的选定状态；

 

 

今天，通过以上3个文件，就可以实现单元格的样式设置，是不是很简单。