vue答题程序一页一题

2024-09-06

用 Vue 开发一个简单的答题应用（一）

Vue 之类的 MVVM 框架,能帮助我们用更少的代码实现复杂的业务. 为了简单一点,开发计划分成三阶段: 一,数据写死,实现基本的答题效果.支持多种题型. 二,使用本地存储保存数据,支持题目录入的功能. 三,使用数据库,后台实现接口给前端调用. 目前,只实现了第一阶段. Demo,源码

这个选项调查的特效以选项卡的形式,每答完一道题目自动切换到下一条,颇具特色.使用jQuery和CSS3,适合HTML5浏览器. 效果展示 http://hovertree.com/texiao/jquery/87/ 源码下载:http://hovertree.com/h/bjaf/sym1l16q.htm 效果图如下: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &

vue项目实现详情页后退缓存之前的数据

vue项目实现详情页后退缓存之前的数据 2019年02月19日 14:54:57 不想写代码的程序员阅读数:244 一.需要缓存的内容: 1.后退缓存条件查询的数据 2.后退缓存分页信息二.实现通过参考网上搜集的资料知道用keepAlive实现参考地址:https://blog.csdn.net/sinat_17775997/article/details/80950246 1.在路由文件router.js中针对要缓存的页面进行设置添加keepAlive: true,通过此字段判断

“四大高手”为你的 Vue 应用程序保驾护航

全球都在处理数字化转型的问题,飞速发展的同时也为基础设施带来了一定的压力.同时许多黑客也在不断更新升级他们的攻击技术. 如果我们的应用程序有过多漏洞,被抓按住利用,就会变成大型芭比Q现场. 这也是为何现在如此多团队将安全性转向左翼,甚至将技术从 DevOps 迁移到到 DevSecOps. 所以很多开发者对于程序安全性有一定顾虑,甚至会占用一些时间专门关注安全问题,但事实上我们并不需要为了保证绝对安全性而牺牲版本的快速更迭. 本文将为大家介绍四种可以帮助我们便捷保护 Vue 应用程序的便捷方法,

快速构建一个使用axios的vue应用程序（转）

英文原文:https://www.sitepoint.com/fetching-data-third-party-api-vue-axios/ 译文:https://segmentfault.com/a/1190000009192118 通常情况下,在构建JavaScript应用程序时,会从远程获取数据或使用API.我最近研究了一些公用API,发现有很多很酷的东西可以用在这些获取到的数据上. 我将演示如何构建一个简单的新闻app,它将显示当天的热门新闻,还允许用户通过感兴趣的类别进行过滤.我们将

vue学习之用 Vue.js + Vue Router 创建单页应用的几个步骤

通过vue学习一:新建或打开vue项目,创建好项目后,接下来的操作为: src目录重新规划——>新建几个页面——>配置这几个页面的路由——>给根实例注入路由配置 src目录重整在项目中创建如下对应的文件 ├── App.vue // APP入口文件 ├── api // 接口调用工具文件夹 │ └── index.js // 接口调用工具 ├── components // 组件文件夹,目前为空 ├── config // 项目配置文件夹 │ └── index.js // 项目配置文

基于VUE的SPA单页应用开发－加载性能篇

1.基于异步数据的vue页面刷新先看看基于异步数据的vue页面刷新后,都发生了啥- 如图所示: 图1 基于异步数据的vue页面刷新网络请求图步骤如下: step1:请求页面: step2:请求页面内的css.js资源: step3:vue页面初始化: step4:页面渲染,框架呈现［无数据内容］: step5:请求页面实际数据: step6:数据ready,填充视图,图片资源加载: step7:完整页面呈现. 步骤分析: step1:请求html文件: step2:请求资源: 优化点: a

BZOJ第一页刷题计划

BZOJ第一页刷题计划已完成:67 / 90 [BZOJ1000]A+B Problem:A+B: [BZOJ1001][BeiJing2006]狼抓兔子:最小割: [BZOJ1002][FJOI2007]轮状病毒:找规律 + 高精: [BZOJ1003][ZJOI2006]物流运输:最短路 + DP: [BZOJ1004][HNOI2008]Cards:Burnside 引理 + DP: [BZOJ1005][HNOI2008]明明的烦恼:prufer编码 + 高精: [BZOJ1007][

小程序单页应用的 tab切换实现

【vue】vue中实现标签页

前言 tab标签页实现很多, 纯css实现, js实现等, 外加一些特殊动画. vue中实现标签页实现 keep-alive标签和is特性 vue-router中嵌套路由 is特性实现(推荐) 优点:不要依赖第三方适用:较为简单的页签导航, 如果需要保存其他页签状态, 外部使用<keep-alive>包裹即可官网参考 vue-router中嵌套路由实现优点:适用简洁适用:较为复杂的页签导航官网参考

Vue是如何渲染页面的，渲染过程以及原理代码

Vue是如何渲染页面的,渲染过程以及原理代码:https://www.cnblogs.com/ypinchina/p/7238402.html

使用 Vuex + Vue.js 构建单页应用

鉴于该篇文章阅读量大,回复的同学也挺多的,特地抽空写了一篇 vue2.0 下的 vuex 使用方法,传送门:使用 Vuex + Vue.js 构建单页应用[新篇] -------------------- 华丽的分割线 -------------------- 原文地址:https://coligo.io/learn-vuex-by-building-notes-app/ 前言:在最近学习 Vue.js 的时候,看到国外一篇讲述了如何使用 Vue.js 和 Vuex 来构建一个简单笔记的单页应用

使用 Vuex + Vue.js 构建单页应用【新篇】

使用 Vuex + Vue.js 构建单页应用[新篇] 在去年的七月六号的时候,发布了一篇使用 Vuex + Vue.js 构建单页应用的文章,文章主要是介绍 vuex 的基本使用方法,发现对大部分的入门同学有很大的帮助,时至今日还有很多同学不断的点赞与收藏,浏览量最高达到 20.4K .鉴于前端技术发展更新快速,特此在这里重新整理一篇 vue2.0 版本的 vuex 基本使用方法,希望能给更多刚入门或者将要入门的同学带来帮助. 这篇文章主要是介绍最新 vue2.0 API 的使用方法, 和

使用Vue快速开发单页应用

本文所涉及代码全在vue-cnode 单页应用,即在一个页面集成系统中所有功能,整个应用只有一个页面.因为路由的控制在前端,单页面应用在页面切换时比传统页面更快,从而在前端体验更好. 将逻辑从后端转移到前端,提升了性能减少了页面加载时间,前后逻辑更扁平.但是当页面复杂度变高时,你会发现,数据处理,UI交互将变得难以维护,所以应运而生,出现了很多MV框架和类库.Vue就是其中之一,个人觉得(非喜勿喷)Vue类库相对于其他MV框架上整体的api更为简洁,提供的api很平衡,解决了问题的同时,没有增加

vue项目实现列表页-详情页返回不刷新，再点其他菜单项返回刷新的需求

问题背景:有时候一些列表会有一些跳转的需求,比如跳到详情页.或者是其他相关的页面(比如跳到用户列表去查看用户的相关信息)等,此时再返回列表页,列表页会刷新重置.目前需求就是需要改成如下情况: 问题1.列表 - 详情页,返回,不刷新重置: 问题2.再点其他菜单,再返回,需要刷新重置. 解决思路: 解决需求自然是想到vue的keep-alive去缓存组件,但是缓存组件有个不好的弊端,就是以后再进入页面也一直保持着上一次浏览的状态,那么如果我们有很多查询条件的情况,或者比如 route/:id 这种动

浅谈vue,小程序，react基础绑定值

最近一直在用react开发项目,碰见的问题千千万,很多,但是都殊途同源,唯一区别大的就是没有像vue的双向绑定,也没有小程序的单向方便,比如: vue v-modal="msg" 直接就可以绑定小程序 value={msg} 改变值的时候就需要 setData 去改变值 react就麻烦很多 <input value={msg} onChange={change} /> change=()=>{this.setState({msg:event.t

vue+vuex构建单页应用

基本构建工具: webpack 语言: ES6 分号:行首分号规则(行尾不加分好, [ , ( , / , + , - 开头时在行首加分号) 配套设施: webpack 全家桶, vue 全家桶项目结构基本目录结构 api :封装与后端接口交互的操作 common :放置一些 reset.css 之类的 components :组件 entry :项目入口文件 index.js,index.css,index.html filters :过滤器.注:虽然 vue2.0 已经基本废弃(只保留

Vue/小程序/小程序云+Node+Mongo开发微信授权、支付和分享

大家好,我是河畔一角,今天给大家介绍我的第三门实战课程:基于微信开发的H5.小程序和小程序云的授权.支付和分享专项课程. 一.这一次为什么会选择微信支付和分享的课题呢? 金庸的小说中曾提到:有人的地方就有江湖.微信的月活达到10亿,因此微信的生态和江湖再中国无疑是巨无霸,既然是江湖,那必然少不了厮杀和争斗. 纵观国内市场,支付两大巨头微信和支付宝,得益于微信的社交基因,恰恰是我们前端开发者的天然战场,再公司的业务当中,我们的营销活动.公众号.小程序.微信H5等等无一不是我们前端必学技能.必备杀手

微信小程序空白页重定向---二维码扫描第二次进入不经过onLoad过程解析scene参数，跳转问题

在刚开始的时候将小程序的入口文件直接指向tabbar 的首页,此时出现问题:二维码扫描,第一次不关闭首页,第二次进入时:不会经过onLoad过程解析scene参数: 官方中解释:tabbar跳转方式触发的生命周期是 onShow,不经过onLoad,下图: 此时,和小伙伴讨论重定向问题时,想到用类似的方法可以做到,就立马实行: app.json中加pages/index/index(入口文件),pages/home/home(tabbar页面主页),pages/detail/detail(详情页

微信小程序--详情页的推荐位置继续打开详情页；返回之后分享等数据不正确问题

问题背景 -- 分享的数据来源当前在维护的小程序项目使用wepy开发:分享的数据都是通过接口请求后台的形式获得:然后存在了数据data的对象中:类似定义分享数据 data = { shareData: "", // 分享数据 } 获取分享数据 tip.getShareDataReci(res => { that.shareData = res; // 赋值后台返回的分享数据 that.$apply(); }, curCode); // curCode当前商品的唯一code值

vue+layui制作列表页

优点: 1.选用layui国产. 2.layui有一套完整的前端框架,基本哪来就可以用. 3.选用vue去掉了很多页面元素js拼接的繁琐,及不易修改. 4.vue里面还有一些过滤器等,用起来很方便. 列表页: 1.用vue数据绑定,加载表格. 2.用layui做分页处理. 3.用的bootstrap做列表样式.也可以用layui的一套列表样式 4.用vue插件axios,做ajax请求. 先上代码 <!DOCTYPE html> <html> <head> <me