Tag: Vue

128 total results found

基于 Laravel Sanctum + Vuex + Vue 路由导航守卫实现 SPA 用户认证

Vue.js 入门到实战教程 构建单页面应用

为了简化流程,我们这里仅支持博客管理员登录并发布文章,也就是前面创建用户 ID 为 1 的测试账号,不提供普通用户的注册登录。 在...

由 学院君 发布于1 month ago    浏览数: 365    点赞数: 0

基于 Laravel + Vue + Vuex 实现博客应用文章发布功能

Vue.js 入门到实战教程 构建单页面应用

Laravel 后端接口准备 既然是博客应用,肯定要支持文章发布功能。 我们先在 Laravel 后端 PostControll...

由 学院君 发布于1 month ago    浏览数: 279    点赞数: 0

引入 Vuex Store 管理 Vue 组件数据状态的更新和获取

Vue.js 入门到实战教程 构建单页面应用

为了更优雅地管理页面组件的数据状态,你可以通过引入 Vuex 来存储和更新博客文章的数据信息。 封装 API 接口请求 学院君之...

由 学院君 发布于1 month ago    浏览数: 240    点赞数: 0

通过后端接口返回数据渲染 Vue 页面组件并实现分页功能

Vue.js 入门到实战教程 构建单页面应用

整体思路 在上篇教程中,我们在 Laravel 后端编写好了文章相关 API 数据接口,接下来,还需要在 Vue 页面组件中通过这...

由 学院君 发布于1 month ago    浏览数: 297    点赞数: 0

页面布局(下):引入 Tailwind CSS 框架构建博客应用 UI 界面

Vue.js 入门到实战教程 构建单页面应用

在上篇教程中,学院君给大家演示了单页面博客应用前端路由和页面布局的基本构建,不过由于没有应用任何 CSS 样式代码,所以 UI 界面...

由 学院君 发布于1 month ago    浏览数: 373    点赞数: 0

页面布局(上):基于 Vue Router 命名路由实现动态路由导航

Vue.js 入门到实战教程 构建单页面应用

我们依然以博客应用为例演示基于 Laravel + Vue 框架构建单页面应用。 页面布局模板 对于博客应用而言,除了首页和关于...

由 学院君 发布于1 month ago    浏览数: 305    点赞数: 0

基于 Vue Router 构建单页面应用项目骨架

Vue.js 入门到实战教程 构建单页面应用

基于读者的反馈,希望多出一些高级进阶版的教程,所以后续学院君仍然会以后端进阶教程为主,不过单页面应用和相关项目作为全栈开发系列的收尾...

由 学院君 发布于2 months ago    浏览数: 387    点赞数: 0

基于 TDD 模式编写 Vue 评论组件(下):Axios 请求后端接口测试

Vue.js 入门到实战教程 测试驱动开发

在本篇教程中,学院君将以评论创建接口为例,演示如何在 Vue 组件中为通过 Axios 调用后端接口编写测试用例。 准备工作 后...

由 学院君 发布于2 months ago    浏览数: 260    点赞数: 0

基于 TDD 模式编写 Vue 评论组件(中):父子组件之间的通信测试

Vue.js 入门到实战教程 测试驱动开发

拆分评论列表组件 为了测试 Vue 父子组件之间的通信,我们需要将之前编写的评论组件拆分成两部分 —— 将评论列表拆分成独立的子组...

由 学院君 发布于2 months ago    浏览数: 239    点赞数: 0

基于 TDD 模式编写 Vue 评论组件(上):数据绑定和列表渲染

Vue.js 入门到实战教程 测试驱动开发

上篇教程学院君给大家演示了 Vue 组件测试套件(Vue Test Utils + Mocha + jsdom + Expect)的...

由 学院君 发布于2 months ago    浏览数: 288    点赞数: 0

基于 Vue 测试套件引入 Mocha + Expect 测试 Vue 组件

Vue.js 入门到实战教程 测试驱动开发

Vue 测试套件 天下乌鸦一般黑,天下的单元测试流程也都差不多。 在 Vue 框架中编写单元测试的基本流程和学院君之前在 Lar...

由 学院君 发布于2 months ago    浏览数: 327    点赞数: 0

基于 Flickity 在 Vue 中实现轮播图组件并设置简单的博客布局

Vue.js 入门到实战教程 组件实战

准备工作 除了自己纯手工从头开始编写之外,还可以基于丰富的第三方 JavaScript 插件更快捷地编写 Vue 组件,这里学院君...

由 学院君 发布于2 months ago    浏览数: 322    点赞数: 0

在 Vue 中实现拖放式图片上传组件

Vue.js 入门到实战教程 组件实战

在上篇教程中,学院君给大家演示了如何基于 Laravel + Vue 框架快速实现图片上传并且给文章添加了封面图片功能。除了传统的点...

由 学院君 发布于2 months ago    浏览数: 315    点赞数: 0

基于 Laravel + Vue 框架实现文件异步上传组件和文章封面图片功能

Vue.js 入门到实战教程 组件实战

在今天这篇教程中,学院君将给大家演示如何基于 Laravel + Vue 框架编写一个基本的图片异步上传组件,并且带预览功能,然后把...

由 学院君 发布于2 months ago    浏览数: 359    点赞数: 0

给 Vue 模态框组件的打开关闭添加过渡/动画效果

Vue.js 入门到实战教程 组件实战

既然我们可以完全掌控模态框的打开和关闭了,不如给它加点过渡/动画效果,让用户体验更好一些,Vue 框架官方提供了组件渲染/隐藏的过渡...

由 学院君 发布于2 months ago    浏览数: 345    点赞数: 0