美食杰--编辑个人资料

最新推荐文章于 2022-11-25 16:49:53 发布
最新推荐文章于 2022-11-25 16:49:53 发布
阅读量94 收藏
点赞数
分类专栏： 笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Sco_114/article/details/120541144
版权

编辑个人资料

通过v-model双向数据绑定
当点击保存把用户输入的头像，昵称，个人简介存放进userInfo这个对象中（userInfo是vuex中的数据，是可响应的）

请添加图片描述

存数据
请添加图片描述
通过点击保存（save）把数据存到vuex中的userInfo
请添加图片描述
上传头像页— user-img.vue
复制框架中上传用户头像的属性过来即可（都能用到）
请添加图片描述
接收父组件传递来的数据
请添加图片描述

图片上传的限制规则，满足条件可以上传

请添加图片描述

总结：通过点击事件把数据（头像，昵称，简介）存进vuex（响应式）

在上传头像时需要满足我们定义的限制规则，满足可上传

好想吃麻薯
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
美食杰-------个人空间
weixin_55225560的博客
10-08 99
路由配置： { path:'/space', name:'space', component:()=>import('@/views/user-space/space.vue'), redirect:{ name:'works' }, children:[ { ...
vue项目美食杰 -- 个人信息展示与修改
Im_xiaopei的博客
09-26 4588
今天是项目的第三部分，个人信息的展示与修改，在此，笔者只想说，做个项目真的是费劲，但是，越困难的东西写着不是越有意思嘛，毕竟伟大的哲学家‘沃兹基硕德’（我自己说的）：学习就要学不会的东西，要不然学什么习。开个玩笑，步入正题。 老规矩先上效果图，让大家明白今天要写点啥 ...
美食杰-编辑个人资料效果
wzstd的博客
09-26 126
编辑个人资料效果展示： 实现步骤： 首先找到登录也如图一） 需要先点击跳转到个人空间（如图一） 点击编辑个人资料跳转到 （如图2） 通过编辑资料跳转到编辑
美食杰-编辑个人资料
as_long_的博客
09-26 86
一、介绍 美食杰的编辑个人资料是在成功登录后，修改个人资料 页面展示： 二、过程 1.首先渲染页面edit，通过v-model双向数据绑定，获取改变的数据，再调用api <div class="edit"> <div class="edit-item"> <span class="label">修改头像</span> <upload-img imgMaxWidth="210" .
美食杰项目 -- 编辑个人资料（六）
weixin_62897746的博客
11-25 582
本文给大家讲解，美食杰项目中 实现编辑个人资料页的效果，和具体代码。 具体实现思路： 1. 在个人主页中点击编辑个人资料进入当前页 2. 引入element-ui进行图片的上传 3. 修改完所有信息后 4. 点击保存会对个人资料进行更改 5. 并跳转至个人主页
20210924_美食杰-编辑个人资料
weixin_57550930的博客
09-25 95
①配置路由 在router.(index.js)中配置 ①import edit from '@/views/user-space/edit' import space from '@/views/user-space/space' ②{ path:'/edit', name:'edit', title:'个人页', component:edit, }, { path:'/space', nam
美食杰-个人简介
yxy831524yxy的博客
10-09 103
个人简介-图片 图片1 图片2 在router文件夹中的index.js import space from '@/views/user-space/space.vue' import MenuList from '@/views/user-space/menu-list.vue' import Fans from '@/views/user-space/fans.vue' const router = new Router({ { path:'/space', name:'s
美食杰-个人空间
as_long_的博客
10-08 112
一、介绍 个人空间包含上面的基础信息和下面的发布、关注等。 二、过程 首先获取数据进行渲染，监听路由变化，来判断路由是否有userId，如果有则代表不是自己的空间，则通过api调用后端获取数据。如果没有，则代表是自己的空间，则获取vuex里的userInfo。在data里面创建一个名为userInfo的对象，然后把获取到的数据进行赋值。 watch:{ // 监听路由变化，来判断路由是否有信息，从而分辨是否为自己的空间 $route:{ async handle.
美食杰项目---个人空间
m0_62201566的博客
10-09 138
今天继续来写美食杰项目之个人空间，连载哦！！！ 总体思路 1.显示别人的空间 a.地址栏中如有userId 则显示对应的用户数据 2.显示自身空间 a.如果没有userId 则默认显示自己信息 b.如果在菜谱中 点击自己 也是有userId传递 c.通过判断是否为自己的 如果是，不需要后端拿,登录时，个人信息已经存在vuex中 ...
html-css-网页模板-美食
11-23
这个模板可能包含了一系列精心布局和设计的页面，旨在为用户提供一个吸引人的在线平台来展示美食图片、食谱或者餐厅菜单。 【描述】"html-css-网页模板-美食"的描述暗示了这个模板主要由HTML（超文本标记语言）和...
美食大师Deliciousfood-master
06-16
【美食大师Deliciousfood-master】是一款基于微信小程序的美食应用源代码项目，旨在为用户提供丰富的美食制作教程、菜谱分享以及美食社区互动功能。通过这个项目，开发者可以学习到微信小程序的开发流程、前端框架的...
美食杰餐饮管理系统.rar
03-17
《美食杰餐饮管理系统详解》 在当今信息化社会，餐饮行业的管理效率与服务质量直接影响着企业的竞争力。美食杰餐饮管理系统，作为一款专为餐饮业设计的管理软件，旨在通过智能化、自动化的方式提升餐厅运营效能，...
美食-美食网站-美食网站源码-美食网站java代码-基于springboot的美食网站-美食项目-美食项目代码-美食代码-代码
04-15
美食-美食网站-美食网站源码-美食网站java代码-美食网站设计与实现-基于springboot的美食网站-基于Web的美食网站设计与实现-美食项目-美食项目代码美食系统-美食系统源码-美食管理系统-美食管理系统java代码-美食...
红色龙年2024新年工作计划PPT模板
07-13
【作品名称】：红色龙年2024新年工作计划PPT模板 【适用人群】：适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。
项目管理策划编写模板.docx
07-13
项目管理策划编写模板.docx
架子管及扣件现场管理规定.docx
07-13
架子管及扣件现场管理规定.docx
Swift语言教程&案例.docx
最新发布
07-13
Swift 是由 Apple 开发的一种现代、安全、快速的编程语言，适用于 iOS、macOS、watchOS 和 tvOS 应用程序开发。以下是一个详细的 Swift 语言教程，适合初学者逐步学习。
ctf_tools_list.md
07-13
ctf_tools_list
美食风格-商务文档3 (3).pptx
10-23
美食节，美食街，美食广告，美食推广，美食宣传，ppt模板，最新最全；;牛奶果汁项目计划书适用于商务总结/工作总结/工作计划2019单位：×××报告人：×××项目背景Part 01现状分析Part 02项目特色Part 03市场评估...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值