1.先用node+express+mysql简单配置一下后台const express = require(express); const mysql = require(mysql); const static = require(express-static);const db = mysql.createPool({host: localhost,user: nodejs,password: nodejs,database:resume,port: 3306 });var app = express(); // ====》设置了一个 /resume 的接口，并将从数据库获取的数据data，send到前台（接口名字随便取的） app.use(/resume, (req, res)=>{db.que...
一下demo演示2.0中的vue-router是如何获取到不同参数的，并在地址栏中匹配不同的信息 <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><title>Document</title><script type="text/javascript" src="vue.js"></script><script type="text/javascript" src="vue-router.min.js"></script> </head><body><div id="box"><!-- 跳转路径 --><router-link to="/home">home</router-link><router-link to="/news">news</rou...
假设有一个标签h5, 我们给它添加了一个自定义属性值，（item.id是从动态添加的） 点击h5 标签，如何才能获取当前对应的自定义属性值呢？ 想当然的我最开始这样写：<h5 class="left t-title" @click=getDataId :data-id="item.id"></h5><script>methods: {getDataId() {console.log(this.data-id);}},</script> 显然，这样是拿不到 data-id的值的。。。。 应该这样做：<h5 class="left t-title" @click=getDataId(item.id) :data-id...
vue.js动态获取数据库数据 (通过vue.cli和webpack搭建的环境) 1.首先我先在创建一个静态的data.json文件，在static下创建json文件夹，(webpack环境下，静态的文件放在static目录下) {"data":[{"id":1,"name": "yidong", "age": "11" },{"id":2,"name": "yidong2", "age": "12" },{"id":3,"name": "yidong3", "age": "13" },{"id":4,"name": "yidong4", "age": "14" },{"id":5,"name": "yidong5", "age": "15" },{"id":6,"name": "y...
Vue.js与jQuery不冲突？？？ 在实际的应用中，几乎90%的数据是来源于服务端的，前端和服务端之间的数据交互一般是通过ajax请求来完成的。 说到ajax请求，第一反应肯定想到了jQuery，项目中如果引入jQuery会帮助我们简化很多操作，简化DOM操作，ajax方法获取后端数据等。 然而，Vue.js和jQuery冲突吗？？？ 答案显然是不冲突！！！ 接下来会实现Vue.js组件中使用jQuery的ajax方法获取服务器端数据并绑定至组件的data中。 创建Vue.j...
最近在搞毕业设计想趁机学学前端知识，于是就应用了目前比较流行的vue框架来进行数据显示，使用BootStrap进行简单的样式编写 1.第一步肯定是包的导入了 目前对node.js还不是很了解，所以包都是手动下载导入的，没有用到那个nmp vue.min.js是vue的主包，vue-resource.js是开源的vue Ajax包，对ajax进行了封装 bootstrap既就是样式的相关css和js了 <script type="text/javascript" src="/js/vue-resource.js"/> <script type="text/j...
在vue项目中组件间相互传值或者后台获取的数据需要供多个组件使用的情况很多的话，有必要考虑引入vuex来管理这些凌乱的状态，今天这边博文用来记录这一整个的过程，后台api接口是使用webpack－server模拟的接口，这个前面的文章中有提到，需要的可以去翻阅。 整个的流程是在组件的created中提交dispatch，然后通过action调用一个封装好的axios然后再触发mutation来提交状态改变state中的数据，然后在组件的计算属性中获取state的数...
最近在项目中使用了vue.js。在爬坑的路上遇到了很多问题。这里都会给记录下来，今天要说的是怎么获取自定义属性的值。 HTML <!DOCTYPE html> <html> <head> <script src="http://vuejs.org/js/vue.js"></script><meta charset="utf-8"><title>JS Bin</title> </head> <body><div id="app"><button v-for="list in items" @click="getType(list.type)" :type="list.type">click{{list.type}}</button><p>type:{{type}}</p></div></b...
问题背景： 点击用户头像 => 进入用户个人中心，在用户个人中心里点击其他用户的头像，我希望显示被点击用户的个人中心，但只看到了路由参数在发生变化，页面内容并没有更新。如图：页面代码如下：<script>export default {data() {return {data: {}}},methods: {fetchDate() {// 使用 axios获取数据......},created() {this.fetchDate();}} </script> 解决办法： 使用 watch，观察路由，一旦发生变化便重新获取数据！<script>expo...
在 vue 中用 document 获取 dom 节点进行节点样式更改的时候有可能会出现 style is not definde的错误，这时候可以在 mounted 里用 $refs 来获取样式，并进行更改：<template><div style="display: block;" ref="abc"><!-- ... --></div> </template> <script>export default {mounted () {console.log(this.$refs.abc.style.cssText)}} </script>结果是 display: block; 如果我们给一个div设定全屏背景图，就需要获取屏幕高度进行...
vue.js 是数据绑定的框架，大部分情况下我们都不需要直接操作 DOM Element，但在某些时候，我们还是有获取DOM Element的需求的； 在 vue.js 中，获取某个DOM Element常用的方法是将这个元素改成一个组件 (component)，然后通过 this.$el 去获取，但是在一些很小的项目里，在一些没有使用 webpack 等构建工具的项目中，创建一个组件并不是那么值得，所以 vue 提供了另一种操作DOM元素的方式，就是自定义指令 (directive) ； 自定义指...
不说废话上代码： <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><title>vue js</title><style>.completed {text-decoration: line-through;}.something {color: red;}</style></head><body><div class="container"><div id="app"><task-app :list="tasks"></task-app></div><template id="task-template"><ul><li v-for="task in list">{{ task.id }} | {{ task.author }} | {{ task.name }} | {{ task.price }}<...
在VUE开发时，数据可以使用jquery和vue-resource来获取数据。在获取数据时，一定需要给一个数据初始值。 看下例： <script type="text/javascript">new Vue({el:#app,data:{data:""},created:function(){var url="json.jsp";var _self=this;$.get(url,function(data){_self.data=eval("(" + data +")");})/*this.$http.get(url).then(function(data){var json=data.body;this.data=eval("(" + json +")");},function(response){con...
在项目中，分页是由后台SQL获取。在table表格多选时，容易把选中的值传给后台，但是怎样在返回上一页时怎样记住表格多选的数据？？当返回第二页时，应该把第一条数据再选中，保持选择状态。具体思路：在页面不重新刷新加载时，使用二维数组保存el-table表格多选结果。其中一维下标记录页码，二维下标记录选中的数据。 说明：tableLoad（）函数，this.tableData---通过Ajax获取本页码的列表数据 说明：handleSelectionChange（）---...
java获取当前时间代码（适合于是springboot+vue+java）/*** 获取当前的的动态时间格式*/Calendar calendar = Calendar.getInstance();SimpleDateFormat format = new SimpleDateFormat("YY-MM-DD HH:MM:SS");//日期格式:年-月-日 时-分-秒goodsIn.setPurchaseDate(calendar.getTime());