vue
关注
分享
扫一扫
WangLingyun111
这个作者很懒，什么都没留下…
展开
-
美食杰-----发布菜谱（完结）
这篇写的是美食杰---发布菜谱页面，这是美食杰最后一篇文章了。给大家整理一下其余几篇美食杰项目的页面：美食杰---首页：美食杰项目---首页_m0_62201566的博客-优快云博客美食杰---登录页：美食杰项目----登录页面，看了不会来找我！！！_m0_62201566的博客-优快云博客美食杰---编辑个人资料：用vue实现美食杰项目---编辑个人资料，傻瓜式教程，看了就会！！！_m0_62201566的博客-优快云博客美食杰---个人空间：美食杰项目---个人..原创 2021-10-13 20:05:15 · 249 阅读 · 0 评论 -
美食杰----详情页（续写）
今天要讲的是美食杰详情页面，这个页面主要讲述的是菜品制作的详细步骤，其中分为三部分：头部，内容和评价。思路：根据menuId 请求数据(查看数据结构),渲染页面(如果没有menuld，提示框请登录) 注意:数据结构过多，在保存到组件中时，提前写好默认值。避免在异步请求返回数据之前找不到属性。 头部: 1.根据数据，逐个渲染头部页面。用户信息中，query传入用户id，跳转个人空间。 2收藏按钮:判断是否本人登录再显示。 ...原创 2021-10-12 20:18:06 · 193 阅读 · 0 评论 -
美食杰----菜谱大全（二）
这篇文章接着续写上一篇菜谱大全，这篇文章主要写的是右边的侧栏部分。一.思路：1.首先布局，要用到Element Ui组件来布局。 2.然后从后端获取数据。 3.将调用到的数据进行解构，再创建个空数组，将要用的数据保存的新建的数组里。 4.渲染数据。 5.实现Loading加载事件。 6.实现页码跳转效果，点击相应的代码，出现内容。...原创 2021-10-11 19:16:45 · 230 阅读 · 0 评论 -
美食杰----菜谱大全
今天我们来写美食杰的菜谱大全页面，首先要讲的是实现这个页面的流程：拿到数据----渲染数据----监听路由传参----判断----写点击事件1.在api里面拿到数据getClassify, getProperty, getMenus。2.再创建个空数组classify存放数据，把数据赋值给data。3.渲染数据，用v-for渲染数据。4.在watch里深度监听路由传参。5.再用if判断，判断是否点击，如果点击过就取消；否则，选中。6.用@click写点击事件，点击的时候地址栏中的原创 2021-10-09 20:24:52 · 525 阅读 · 0 评论 -
美食杰项目---个人空间
今天继续来写美食杰项目之个人空间，连载哦！！！总体思路1.显示别人的空间a.地址栏中如有userId 则显示对应的用户数据2.显示自身空间a.如果没有userId 则默认显示自己信息b.如果在菜谱中 点击自己 也是有userId传递c.通过判断是否为自己的 如果是，不需要后端拿,登录时，个人信息已经存在vuex中...原创 2021-10-09 15:04:11 · 189 阅读 · 0 评论 -
Vue-Router手把手教程，超详细！！！
安装：npm install vue-router1.router-view<router-view>是一个功能性组件，用于渲染路径匹配到的视图组件。可以配合<transition>和<keep-alive>使用。如果两个一起用，要确保在内层使用<keep-alive>。<router-view></router-view> <!--或--> <router-view name="footer"&g.原创 2021-10-06 23:04:30 · 429 阅读 · 0 评论 -
用vue实现todos，todos里面包含了增删改查功能，不会的看过来，保准你会！！！
一.先写静态页面，然后把静态页面分组件划分，最后再写效果，效果有增删改查。二.效果展示：三.代码展示：todos.css:*{ padding: 0; margin: 0;}ul,ol,li{ list-style: none;}body{ background-color: #F5F5F5;}#app{ width: 550px; margin: 10px auto; }.title{ height: 150px; line-height: 150.原创 2021-10-05 17:00:00 · 1154 阅读 · 0 评论 -
vue中组件通信的方式有哪些？
1.父传子：在子组件中可以接收父组件传入的值：基于属性传递通过props接收；通过props接受的属性和data数据一样，是直接挂载到实例上的。例子：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">...原创 2021-10-05 11:47:32 · 225 阅读 · 0 评论