用vue实现的简单备忘录

最新推荐文章于 2024-08-30 20:28:37 发布
最新推荐文章于 2024-08-30 20:28:37 发布
阅读量1.5k 收藏 8
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_46486125/article/details/108963580
版权
本文介绍了在学习Vue和vue-router之后，作者快速上手并实现了一个备忘录应用。该应用能显示输入的备忘信息，包括自增ID、内容和创建时间，并支持删除功能。通过提供的代码示例，读者可以了解如何在Vue中构建此类功能。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

学习了vue,vue-router后，上手快，逻辑思维相比更加简单，于是写了一个实现备忘录的代码
其代码可实现的功能有：
1，输入一条信息，可以依次显示出id(序号)并且是自增，显示输入的内容，以及输入时间
2，可删除信息记录

效果图如下：
在这里插入图片描述
当删除第二条信息时，就剩第一条和第二条
在这里插入图片描述
代码如下：
在这里插入图片描述

Vue.js 实现备忘录
zk_813的博客
06-17 1934
效果展示: html代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <!-- 移动设备设置 --> <meta name="viewport" content="width=device-width,initial-scale=1,minimu...
Vue简单备忘录实现
yizhinvlimeng的博客
01-11 644
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/vue.js" type="text/javascript" charset="utf-8"></script> <script src="https://cdn.jsdelivr.net/npm/vue">&.
Vue.js实现备忘录功能
10-16
主要为大家详细介绍了Vue.js实现备忘录功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
vue 备忘录
TCorners博客
05-31 2135
用vue写了个日历备忘录的功能。省略了备忘录的增删改查功能。 直接上代码 &amp;amp;lt;!DOCTYPE html&amp;amp;gt; &amp;amp;lt;html lang=&amp;quot;en&amp;quot;&amp;amp;gt; &amp;amp;lt;head&amp;amp;gt; &amp;amp;lt;meta charset=&amp;quot;UTF-8&am
Vue实现简易备忘录
jakelihua
10-10 853
的value交给v-model处理。同时思考如何用Javascript对数组进行增加和删除元素操作。：本文旨在结合具体项目，让用户学会vue的button组件与个事件怎么结合。：这需要给这个按钮添加绑定一个单击事件。在此事件的处理函数中需要将文本框。随着添加或删除操作，显示的总条数能够随之变化。
vue.js实现备忘录功能的方法
01-19
这个vue实现备忘录的功能demo是K在github上找到的，K觉得这是一个用来对vue.js入门的一个非常简单的demo，所以拿在这里共享一下。 （尊重他人劳动成果，从小事做起~ demo原github地址：https://github.com/vuejs/vue...
vue.js实现备忘录demo
12-03
在这个备忘录的示例中，我们看到如何利用Vue.js的基本特性创建一个简单的备忘录应用。 首先，HTML结构是备忘录的基础。在`<head>`部分，有元标签设置页面的字符编码、视口属性以及浏览器兼容性，这些都是现代Web...
备忘录实现过程问题汇总
10-31 1293
1. 提醒功能的实现问题
vue备忘录单页demo
05-06
配置环境 vue-cli3.0 运行依赖 vue-router，vuex，mint-ui。 安装npm install，npm run serve运行即可
基于Vue开发备忘录
weixin_58747565的博客
05-22 1591
1、首先画出UI界面 我这里是自己画的一款备忘录的UI界面，仅供参考，仅供参考，仅供参考！ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> #app { width: 60%; background-color: #fff; border: 1px solid
vue实现日历备忘录功能
10-16
主要为大家详细介绍了vue实现日历备忘录功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
基于vue的备忘录
06-01
基于vue的备忘录
纯vue实现笔记系统
最新发布
xc9711的博客
08-30 2064
只用vue前端实现笔记系统
Vue.js初学备忘录（二）
lan_学习分享
01-31 429
可能是人老了接受能力变弱了~~总之Vue的调用真是绕晕我，不过也相信后面慢慢会能掌握使用，这次Mark一下这两天新建项目的梳理。 一、修改端口号：找到config文件夹下面的index.js文件，修改里面的参数即可   // Various Dev Server settings     host: 'localhost', // can be overwritten by process.e...
VUE备忘录的增删改查
weixin_45389051的博客
03-06 419
一.图片描述 二.html <div id="app"> <div class="wrap"> <h2 class="sec-title">新建备忘录</h2> <form class="tipForm"> <div class="flex-center"> ...
规范化的使用vuex
weixin_43607164的博客
10-22 958
安装vuex vuex 的使用必须保证先安装 vuex,使用vue脚手架搭建工程的话可以直接勾上 vuex 选项，额外添加可以使用 npm install vuex --save 创建 根目录/src/store/modules/modules1.js(项目大了可拆分更多模块) const modules1= { state: { // 定义组件通用状态 commonState:...
Vue实现的日历备忘录示例
本文档介绍了如何使用Vue.js框架实现一个简单的日历备忘录功能，主要关注于前端展示部分，省略了后端的增删改查操作。作者通过HTML、CSS和Vue组件来构建这个界面，包括日历的样式设计和备忘录日期选择的部分。 首先...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值