效果图： 修改功能不够好，应该在修改时弹出一个专门的修改窗口进行修改功能。增加就是向数组里添加，使用.push()就行，删除和修改都使用splice(),查询将数组里的学号与输入的学号进行对比，查找到后弹出窗口显示该学生姓名。代码如下：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>学生信息管理</title><link rel="stylesheet" h...
我又来了，今天部署了下vue项目，使用nginx做了代理，这样可以解决跨域的问题，这里做一个简单讲解。1.先看vue项目打包（我这里使用的是vscode开发工具）这里是我的项目结构：打包之前需要修改如下配置文件：配置文件一：build>>utils.js (修改publicPath:"../../" , 这样写是处理打包后找不到静态文件的问题)配置文件二：config>>index.js(修改assetsPublicPath:‘./‘ ,修改目的是为了解决js找不到的问题)上面两步修改完成之后就...
在开始写webpack.base.conf.js（简称base）之前，我们先来看一下vue-loader.conf.js这个文件，毕竟在base中我们还会用到：‘use strict‘//引入前一篇文章的utils文件 const utils = require(‘./utils‘) //引入config文件 const config = require(‘../config‘) //判断当前是否为生产环境，如果是则返回true const isProduction = process.env.NODE_ENV === ‘production‘ //是否使用sourceMap，如果是生产环境就使用config文件...
由于没有跨域的接口，所以，用8080端口请求8081端口，来模拟跨域。跨域会出现下面报错。 1.找到config文件夹下index.js，在proxyTable对象里复制以下代码： proxyTable: {‘/apis‘: {// 测试环境target: ‘https://localhost:8081‘, // 接口域名changeOrigin: true, //是否跨域 pathRewrite: {‘^/apis‘: ‘‘ //需要rewrite重写的, } }}, 注意：【更改完这个配置文件后，需要重启项目】 2...
splice(index,len,[item])它也可以用来替换/删除/添加数组内某一个或者几个值（该方法会改变原始数组）index:数组开始下标 len: 替换/删除的长度 item:替换的值，删除操作的话 item为空删除： //删除起始下标为1，长度为1的一个值(len设置1，如果为0，则数组不变)var arr = ['a','b','c','d']; arr.splice(1,1); console.log(arr); //['a','c','d']; //删除起始下标为1，长度为2的一个值(len设置2)var arr2 = ['a','b','c','d'] ...
版本：vue 2.5.2webpack 3.6.0 先说stylus。用npm装个包。npm install stylus stylus-loader --save-dev然后在.vue文件中使用。<style lang="stylus"> ... </style>然后是sublime。需要装两个插件：高亮、自动完成。高亮：https://github.com/billymoon/Stylus自动完成：https://github.com/lnikell/stylus-clean-completions如果你的网络和我一样连不上sublime的服务器，那么装自动完成插件会稍微麻烦一点...因为这个插件是一个....
什么是组件：组件是Vue.js最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。在较高层面上，组件是自定义的元素，Vue.js的编译器为它添加特殊功能。在有些情况下，组件也可以是原生HTML元素的形式，以is特性扩展。 如何注册组件？ 需要使用Vue.extend方法创建一个组件，然后使用Vue.component方法注册组件。Vue.extend方法格式如下：var MyComponent = Vue.extend({// 选项...后面再介绍 }) 如果想要其他地方使...
vue中的周期函数=生命周期函数=生命周期钩子=生命周期事件 说白了就是创建一个实例对象后，从创建 运行 以及销毁中所发生的事件：什么是生命周期：从vue实例的创建 运行 销毁过程中会伴随各种各样的事件，这些事件统称为周期函数1.创建期间的周期函数：beforecreate():实例在内存中刚被创建出来，此时还没有初始化好data和methods属性created():实例已经在内存中创建好，此时data和methods已将ok,此时还没有编译模板beforemount(...
在现在的互联网世界里，自动完成的搜索功能是一个很常见的功能。比如百度、搜狗、360搜索 ...功能描述一下大概是这个样子的：有一个搜索框，用户在里面输入要查询的条件，系统会“智能”判断用户输完了，然后自动根据条件去搜索相关的数据返回给用户。网上这个自动完成的插件很多，实现自动完成功能也不复杂，特别是像vue、angularjs、react这类可以实现双向绑定的库出现以后，实现就更方便了。本文不讲自动完成功能的实现，而是介...
Vue 代码层面的优化；webpack 配置层面的优化；基础的 Web 技术层面的优化。一、代码层面的优化1.1、v-if 和 v-show 区分使用场景v-if?是?真正?的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建；也是惰性的：如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块。 v-show?就简单得多， 不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 的...
题主Vue小白，入门demo时想在其中使用jQuery（当然可能是不推荐的做法哈，毕竟俩儿的风格不一样，但万一你就需要呢 _^ ^_），结果遇到问题，最终倒腾解决。编译报错：$ is undefined or no-undef ‘$‘ is not defined假设你已经使用vue-cli搭建好了开发的脚手架，接下来，看下面。1.NPM 安装 jQuery，项目根目录下运行以下代码npm install jquery --save2.webpack配置在项目根目录下的build目录下找到webpack.base.conf.js文件，在...
Vue 团队于 2020 年 9 月 18 日晚 11 点半发布了 Vue 3.0 版本。那个男人总喜欢在深夜给我们带来意外惊喜！以下为 Vuejs Release 3.0 机器翻译文章，原文 v3.0.0 One Piece。“ https://github.com/vuejs/vue-next/releases/tag/v3.0.0 ”# Vue 3.0 发布今天，我们很荣幸地宣布 Vue.js 3.0“One Piece”的正式发布。这个框架的新的主要版本提供了改进的性能、更小的捆绑大小、更好的 TypeScript 集成、用于处理大规模用例的新 API，...
引入文件：<link rel="stylesheet" href="//unpkg.com/iview/dist/styles/iview.css"><script src="//vuejs.org/js/vue.min.js"></script><script src="//unpkg.com/iview/dist/iview.min.js"></script>html：<div id="iviewTrasnsfer"> <transfer :titles="titles" :data="data_" :target-keys="targetKeys1" :render-format="render" @on-change="handleChange"></tr...
引言：vue的vuex是一个全局状态管理工具，有强大的社区所贡献，方便达到一端改变全局改变功能，这里就不强调如何使用了，单独讲解一下如何更好的使用这个工具。先说一下这个使用的场景，如果仅是父子组件传值这个大可不必使用，当你用本地存储和广播事件都不能满足你的需求时，你就可以考虑使用vuex来管理你的数据了。使用方法：import Vue from ‘vue‘ import Vuex from ‘vuex‘ Vue.use(Vuex) let state = { //vuex的状态对象 ...
Vue Element UI 图片上传ElementUI upload组件上传图片，多看看文档参数，基本没什么难度，我总结以下个人的需求。文档里面其实都有说明，我这边给出使用例子，方便他人。参照ElementUI官网:https://element.eleme.cn/#/zh-CN/component/upload#yong-hu-tou-xiang-shang-chuan上传权限验证 (需要heades里面加上token)预览上传图片(这个其实就很简单了, 我没仔细看文档)上传headers添加token由于我接口限制了headers token验证，所以...