本文实例为大家分享了某视频剪辑软件实现记事本功能的具体代码，供大家参考，具体内容如下

！DOCTYPE html html head meta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8 '标题记事本/title meta http-equiv=' X-UA-Compatible '内容='IE-edge '元名称='viewport '内容=' width=设备宽度，初始比例=1' link rel='样式表type='text/css' href=' ./bootstrap-3。3 .7-dist/CSS/bootstrap。量滴CSS ' rel='外部无跟随'脚本类型=' text/JAVAScript ' src=' http :/vue。js '/script/head body div class=' container ' id=' app ' div class=' row ' div class=' col-MD-6 ' h1 class=' text-success ' { title } }/h1输入类型='text '名称='text '占位符='填写事务v-model=' new item '/button type=' button ' class=' BTN文本-活动' v-: click=' AddItem ' v-: key up。输入=' AddItem '添加事务/button/div/div class=' row ' div class=' col-MD-3 ' div class=' thumbnail ' ul Li v-for='(item，index)in things ' class=' text-center text-info ' v-show=' item。显示“{ item。things } } button class=' BTN BTN-默认BG-info ' v-: click=' remove thing(index)' v-model=' index '删除/button/Li/ul/div/div/body脚本类型=' text/JavaScript ' var Vue=new Vue({ El : ' # app '，data:{ title: '记事本，things :[{ things : ' '，show:false } ]，new things : ' '，message: '待填写的事务为空！'}，方法： { addthing3360 function(){ if(this。新东西){这个。事情。拼接(0，0，{ thing : this . new this，show : true })；这个。newthing=' ' } else { alert(this。message)}，removethings :函数(index){ this。这个[索引].show=false } } })；/script /html效果图：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。