再设置一下这个笔记编辑器的样式 .. 打开 style.css .. 设置一下 .notes .ui 下面的 textarea .. border 设置成 none .. font-size 是 16px .. padding 设置成 0 .. margin ，上下的外边距是 32px .. 左右是 0 ..

这个笔记编辑器，默认可以让它隐藏起来，点击笔记项目可以切换显示这个编辑器 .. 回到 app.js .. 找到 Note 组件 .. 先添加一个数据，名字是 open ，让它先等于 false ， 我们可以切换这个 open 的值来判断显示还是隐藏笔记编辑器 ..

在组件的模板里面，找到这个 editor .. 上面加上一个 v-if="open" .. 意思就是如果 open 的值是 true，就显示这个 editor ，如果是 false 就隐藏它 ..

然后在这个 header 元素上面，绑定一个 click ，点击事件 .. 点击的时候把 open 的值设置成跟它现在相反的值 .. open = !open .. 这样可以切换 open 的值 .. 如果之前是 false，点一下就变成 true，如果是 true，再点一下就会变成 false ..

预览

再到浏览器上试一下 .. 现在所有笔记的编辑器都被隐藏起来了 .. 按一下笔记项目 .. 会显示编辑器 .. 再按一下 .. 可以隐藏编辑器 ..

再修改一下这个 header 元素的样式 ..

打开 style.css .. .ui.items 的子元素 .item ，它的子元素 .content 下面的子元素 .header .. 去设置一下样式 .. 把 display 设置成 block

然后把指针设置成 pointer ...

再去试一下 .. 这样鼠标放在这个标题元素上的时候 .. 鼠标指针会变成手形 ...