vue项目4

最新推荐文章于 2024-06-01 16:49:07 发布
最新推荐文章于 2024-06-01 16:49:07 发布
阅读量178 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/steve1988717/article/details/94835463
版权

如何在手机端查看我们做的项目呢？

电脑和手机必须处在同一个域名之下才可以操作
1。查看本电脑的ip的方法命令：在cmd环境中，运行 ipconfig 就可以查看本机的ip地址

然后在配置文件中，配置一下
在这里插入图片描述

--host 172.16.0.31

在这里插入图片描述
在这里插入图片描述

如何获得商品列表？

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

产品列表跳转到产品详情组件的实现

在这里插入图片描述
在这里插入图片描述

还有一种编程式跳转的方法

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

产品详情页面的实现

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
产品详情页第一幕是轮播图，因为多处使用了轮播图，所以我们把轮播图抽离出来，做成一个组建，可以供其他的组建使用
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

商品购买区域的实现

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

加入购物车动画的实现

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
如何让小球做到抛物线效果呢？可以在这个网站设置小球的抛物线效果状态

https://cubic-bezier.com/#.17,.67,.83,.67

在这里插入图片描述

steve1988717
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue-4: 组件通信学习
Forever_Hopeful的博客
08-23 545
Vue组件通信 父子通信和非父子通信 （v-model详解 、.sync修饰符 、ref 和 $refs 、$nextTick）
vue-4
qq_40589140的博客
10-08 1223
style的默认样式是作用到哪里的？scoped的作用是什么？style中推不推荐加scoped？data写成函数的目的是什么？组件通信，就是指组件与组件之间的数据传递组件的数据是独立的，无法直接访问其他组件的数据。想使用其他组件的数据，就需要组件通信组件关系分类有哪两种父子组件通信的流程是什么？父向子子向父组件上 注册的一些 自定义属性1.非父子组件传值借助什么？2.什么是事件总线3.发送方应该调用事件总线的哪个方法4.接收方应该调用事件总线的哪个方法。
vuex4快速入门
前端精髓
11-28 8055
自从 vue2 升级到 vue3 之后，vue-router 从 3.x 升级到了 4.x，vuex 也从 3.x 升级到了 4.x。自从语法发生了较大的变化之后，其他的生态库也必须同步更新了。 现在的 vuex 版本是 4.0.0-rc.2，目前还是预览版本，可以通过下面的命令安装： npm install vuex@next --save 每一个 Vuex 应用的核心就是 store（仓库）。“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (state)。 安装 Vuex 之后，让我
探索 Vue Devtools 4.0 的新世界！
最新发布
前端开发博客
06-01 864
大家好，我是前端宝哥。Vue Devtools 4.0 版本带来了一系列激动人心的新特性和改进，让我们一起来探索这些更新亮点！宝哥省流版：???? 直接编辑组件数据，实时预览变更效果。⚙️ 快速编辑功能，一键切换布尔值，增减数字。????️ 支持在代码编辑器中直接打开组件，开发更便捷。???? 组件名称显示优化，事件过滤功能，让追踪更精准。???? 垂直布局和可折叠检查器，界面更清爽，操作更高效。组件数据直接编辑现在，你...
vue-4：注册组件，组件传参，特殊属性ref $parent $root，透传，内置组件，自定义指令，mixins混入
qq_60839348的博客
05-13 1672
vue-4：注册组件，组件传参，特殊属性ref $parent $root，透传，内置组件，自定义指令，mixins混入
Vue-CLI 4 搭建Vue项目
God-Excious的博客
09-21 3018
文章目录一、Node.js安装二、Vue-Cli安装三、Vue项目创建1、项目创建2、项目依赖导入2.1 vue-router（路由）3、项目配置3.1 router.js（路由配置）4、测试效果 一、Node.js安装 到Node.js官网（https://nodejs.org/zh-cn/）上，下载并安装Node.js，选择【长期维护版】即可 使用安装包安装，选择安装路径可以根据自己的需要改一下（比如我安装在了D:\Environment\nodejs\目录下）。 这个Necessary Tools
vuex4 极速入门到上手
前端人的博客
11-12 1966
vuex4 是 vue3的兼容版本，提供了和vuex3 的相同API。因此我们可以在 vue3 中复用之前已存在的 vuex 代码。 一、安装以及初始化 vuex4安装： npm install vuex@next 为了向vue3初始化方式看齐，vuex4 初始化方式做了相应的变化，使用新的 createStore 函数创建新的 store 实例。 import { createApp } from 'vue' import App from './App.vue' import router
vue项目实战 vue项目实战
01-20
vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战vue项目实战...
vscode新建一个最简单的vue项目
09-27
VSCode作为一款功能丰富的代码编辑器，是开发Vue项目的理想选择。接下来，我们将分步介绍创建Vue项目的步骤。 **一、安装必要工具** 首先，确保你已经安装了Node.js，因为Vue项目依赖于npm或yarn来管理依赖。同时...
vue 项目源码
08-07
这个"vue 项目源码"很可能是某个公司在实际开发过程中创建的一个Vue项目实例，包含了完整的前端应用代码。在这个项目中，我们可以深入理解Vue的核心概念、组件化开发以及与其他库或服务的集成方式。 1. **Vue核心...
ssm+vue项目实战
11-21
在本项目"ssm+vue项目实战"中，我们将探讨如何结合现代前端技术Vue.js与传统的后端MVC框架Spring、SpringMVC和MyBatis，构建一个完整的Web应用程序。这个实战项目旨在帮助开发者理解前后端分离的开发模式，以及如何...
乐橙 vue项目 demo
03-04
【乐橙 vue项目 demo】是一个基于Vue.js前端框架的示例项目，旨在为开发者提供一个基础的开发环境和模板，方便快速上手Vue.js的开发。这个项目包含了多个配置文件和源代码目录，有助于理解Vue项目的结构和配置，以及...
vue
weixin_44954172的博客
09-24 260
vue 什么vue？ 它是一套用于构建用户界面的渐进式框架，采用MVVM思想，Vue 的核心库只关注视图层，Vue也完全能够为复杂的单页应用提供驱动。 安装vue 下载地址 起步 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="view...
Vue - 4（ 8000 字 Vue2 入门级教程）
weixin_73232539的博客
04-06 891
Vue2 框架入门级教程第四篇，8000字详解
Vue基础4 (简单易上手，适合前后端)
qq_57469718的博客
01-01 868
基础-组件-组件通信的几种情况 组件嵌套 => 父子组件 => 父组件传递数据给子组件使用 => 组件之间的传值 => 也叫组件之间的通信 组件之间的通信根据关系的可以分为： 1. 父子组件通信 父组件到子组件 子组件到父组件 2.兄弟组件通信 //调用组件 <div id="app"> <child-a :msg="msgParent"></child-a> </div> //子组件 Vu
Vue 4 - 网络请求
编码时光
07-19 298
Axios网络请求 安装 引入 网络请求基本示例 get请求 post请求 快捷方案 get请求 post请求 Axios网络请求封装 网络请求跨域解决方案 跨域错误提示信息 目前主流的跨域解决方案有两种： Vue引入路由配置 在Vue中引入路由 路由传递参数 嵌套路由配置
Vue-4
tingless的博客
09-23 670
webpack webpack是一个模块化的打包工具， 而且，项目复杂用webpack更加合适。 使用方法： 一般项目中会放2个文件，一个dist用于发布，放到服务器的文件，一个是src是源码。 然后src会放一个js入口文件，名字通常是mian.js或者index.js。 步骤1：在src创建一个js文件，用作专门的某类用途，并且输出（这里是commonjs的方法） function add(num1, num2) { return num1+num2 } module.exports = {
Vue(4)，三面美团、四面阿里成功斩下offer
m0_60635321的博客
04-02 845
前端字节跳动真题解析深入学习提升的进阶课程，基本涵盖了95%以上前端开发知识点，真正体系化！**由于文件比较大，这里只是将部分目录大纲截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新如果你觉得这些内容对你有帮助，可以添加V获取：vip1024c （备注前端）[外链图片转存中…(img-bldIBkXT-1712002925852)]前端字节跳动真题解析[外链图片转存中…(img-QrA34f6k-1712002925852)]
Vue项目
05-26
以下是一些创建Vue项目的步骤： 1. 首先，你需要安装Node.js，因为Vue项目需要使用npm来管理依赖项。 2. 打开终端并创建一个新的Vue项目，命令如下： ``` vue create my-project ``` 这将创建一个名为"my-...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值