1、新建一个html页面,然后在这个代码页面上创建一个div标签id为app,然后在这个div标签里创建一个按钮标签和一个用于显示隐藏的div标签。
2、引入vue.js。在body结束标签前面使用
3、为vue创建挂载点。在vue.js引入文件后面新建一个
4、使用data创建show属性,默认值为true;使用metheds创建一个点击事件(showCont),该事件处理当show值为true就修改给false,当show为false就修改为true。
5、添加显示隐藏功能。在按钮标签上添加点击事件showCont,在按钮标签后的div标签上使用v-if添加show属性。
6、保存html代码,然后使用浏览器打开,点击按钮会发现按钮后面的文字隐藏了,再次点击按钮隐藏的内容又显示出来。