Vue是当前最流行的三大前端框架之一,刚学Vue的时候感觉也没什么新奇的地方,后来对Vue的接触深了才知道这个框架流行的原因了。现在进入正题:先说一说脚手架的作用——它能帮助你快速开始一个vue项目,其实其本质就是给你一套文件结构,包含基础的依赖库,你只需要npm install一下就可以安装。让你不需要为编译或其他琐碎的事情而浪费时间,这并不会限制到你的发挥。 如何安装:进
VUE前段面试题 Vue优点 轻量级框架:只关注视图层,是一个构建数据的视图集合,大小只有几
原创
2022-06-23 12:59:40
162阅读
一、vue-resource在Vue中实现异步加载需要使用到vue-resource库,利用该库发送ajax(Vue官方已不再维护这个库)。1、引入vue-resource:<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1"></script>要注意的是,vue-resource依赖于Vue,所以要先引
2020.7.21今日继续前端vue开发。本人所在小组的两位前端人员似乎还有之前的项目需要处理,看来准备使用本人(后端)开发的前端页面了。PS:本人小组的前端同事基本没有提供任何援助(没空开发页面;不过本人倒是也没啥问题需要问那两位)本人预估周五结束时大概能完成前端的开发,毕竟本人不是专业前端,还一人做着2人的工作(确切的说是3人,原本自己后端的work和2个前端的work)。总的来说,是本人自愿
17、keep-alive的作用是什么?keep-alive是 Vue 内置的一个组件,可以使被包含的组件保留状态,或避免重新渲染。在vue 2.1.0版本之后,keep-alive新加入了两个属性: include(包含的组件缓存) 与exclude(排除的组件不缓存,优先级大于include) 。使用方法: <keep-alive include='include_components'
目录axios的引用axios的二次封装总结 我们都知道,自从前后端分离后,业务逻辑数据都由后端进行维护处理,前端通过网络请求到数据后,进行展示渲染,在实际开发中,我们有常用的axios之类的网络请求库来帮助我们处理相关的请求。 我们接下来就以axios为例,进行网络请求的二次封装。axios的引用首先我们在项目中安装下axios:npm install axios安装好依赖后,在使用的地方直
转载
2024-03-05 21:54:47
75阅读
Vue中key值的作用首先v-for
在列表渲染时,我们可以用v-for基于一个数组来渲染一个列表。v-for指令需要使用item in arr形式的特殊语法来进行渲染列表,arr是源数据,<ul id="example-1">
<li v-for="item in arr" :key="item.id">
{{ item.message }}
</l
转载
2024-04-04 18:45:09
153阅读
Docker使用Nginx部署前段Vue项目
本文将详细记录如何通过Docker以及Nginx部署一个前端Vue项目的整个过程,包括环境准备、分步指南、配置详解、验证测试、排错指南和扩展应用,力求为开发者提供清晰的操作流程和配置说明。
## 环境准备
首先,确保你已经安装以下前置依赖:
- Docker
- Docker Compose
- Node.js
- Vue CLI
以下是环境
2、在项目底部终端里面输入打包命令:npm run build 回车,即可进行打包; 3、经过短暂的等待,如果项目没有什么报错,就直接提示打包完成; 4、打包成功之后,会在项目工程目录里面生成了一个“dist”文件目录,然后单击打开,即可看到dist目录下的文件; 5、然后鼠标右键选中dist文件,然后找到文件位置进入,压缩打包dist文件,上传到服务器,即可。 附录:Vu
转载
2023-10-31 21:01:11
83阅读
借用table组件会说一下父子组件的传值。子组件Table.vue,排名用index,并且自递增,标题的值和数据都是通过父组件传过来的。子组件通过props设置tabHeades:Array,tabDatas:Array接收iu父组件传过来的数组。<template> <li class="tab-wrapper"> <ul class="tab...
原创
2022-01-10 15:32:07
914阅读
创建图片映射<img src ="planets.gif" alt="Planets" usemap ="#planetmap" /><map name="planetmap"> <area shape="rect" coords="0,0,110,260" href="sun.htm" alt="Sun" /> <area sha
原创
2016-07-01 18:43:39
863阅读
文章の目录1、安装vue环境2、创建项目2.1、运行命令2.2、点击创建2.3、设置项目名称,选择包管理器,初始化Git,然后点击下一步2.4、选择创建模式,我在这里选择的是手动2.5、选择Babel、Router、Vuex、Linter/Formatter、使用配置文件,点击下一步2.7、选择vue版本,选择Eslint模式后,点击创建项目2.8、点击任务,点击serve,点击运行2.9、点击
转载
2024-04-15 13:12:47
129阅读
一,ECharts。 它是一个数据可视化框架,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器,供了 图例、视觉映射、数据区域缩放、tooltip、数据刷选等开箱即用的交互组件,可以对数据进行多维度数据筛取、视图缩放、展示细节等交互操作,让你的数据形象生动起来,不再是简简单单的一个表格。二,AntV蚂蚁金服全新一代数据可视化前端框架,短短几行代码就能够做出精美的数据图表,甚至兼容pc端
转载
2023-12-02 23:19:07
59阅读
最终效果:<template> <div id="table"> <div class="add"> <input type=
原创
2023-01-03 15:01:32
122阅读
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script> html <div id="app"> <!--频换切换建议用v-show,性能比v-if好--> <h3 v-show="tab == 1">首页</h ...
转载
2021-07-16 19:27:00
806阅读
2评论
尝试了多次,在customRender的函数中用不了this,用slot来代替解决了html:<a-table :colu
原创
2022-07-06 11:31:13
97阅读
效果图: <template> <div> <a-button class="editable-add-btn" @click="handleAdd"> Add </a-button> <div> <a-table :columns="columns" :data-source="data" bor
原创
2022-09-20 12:02:32
883阅读
var zffwlist=''; var zffw = document.getElementsByName("_ypxx_hclb"); for(var i=0;i<zffw.length;i++){ if(zffw[i].checked){ zffwlist
原创
2022-03-14 14:48:08
150阅读
1.什么是路由路由是根据不同的 url 地址展示不同的内容或页面;2、什么是前端路由?很重要的一点是页面不刷新,前端路由就是把不同路由对应不同的内容或页面的任务交给前端来做,每跳转到不同的URL都是使用前端的锚点路由. 随着(SPA)单页应用的不断普及,前后端开发分离,目前项目基本都使用前端路由,在项目使用期间页面不会重新加载。3、什么是后端路由?浏览器在地址栏中切换不同的url时,每次都向后台服