vuejs解析url地址
函数:
// url解析函数
// ?id=111&name=567 => {id:111,name:567}
export function urlParse(){
let obj = {};
let reg = /[?&][^?&]+=[^?&%]+/g;
let url = window.location.search;
let arr = url.match(reg);
arr.forEach((item) => {
let tempArr = item.substring(1).split('=');
let key = decodeURIComponent(tempArr[0]);
let val = decodeURIComponent(tempArr[1]);
obj[key] = val;
})
return obj;
}
函数作用:解析url地址获得一个对象
使用方法:把以上代码添加到你的公共函数库
<tempalte> </tempalte>
<script>
import {urlParse} from 'urlParse.js';
export default {
data() {
return {
news: {
id: (() =>{
let get = urlParse();
// console.log(get.id); 123
return get.id;
})()
}
}
}
// 发送带参数的请求
created() {
this.$axios.get('/api/news?id=' + this.news.id).then((res) => {
// success callback
let myData = res.data.data;
// 合并对象
this.news = Object.assign({},this.news,myData);
})
}
}
</script>
其实用vue-router更简单
vuejs解析url地址的更多相关文章
- javascript 对象的方式解析url地址参数
看到一个知识点,比如说给一个 url参数,让其解析里面的各个参数,以前我都是通过字符串分割来实现的.但是通过这样的方式比较麻烦,而且操作字符串容易出错.今天看到了一个更有效更快速的方式,就是通过对象来 ...
- javascript中new url()属性,轻松解析url地址
1.首先写一个假的地址(q=URLUtils.searchParams&topic=api)相当于当前的window.location.href const urlParams = new U ...
- jsoup 是一款Java 的HTML解析器,可直接解析某个URL地址
jsoup 是一款Java 的HTML解析器,可直接解析某个URL地址.HTML文本内容.它提供了一套非常省力的API,可通过DOM,CSS以及类似于jQuery的操作方法来取出和操作数据.
- 2016/5/6 thinkphp ①框架 ② 框架项目部署 ③MVC模式 ④控制器访问及路由解析 ⑤开发和生产模式 ⑥控制器和对应方法创建 ⑦视图模板文件创建 ⑧url地址大小写设置 ⑨空操作空控制器 ⑩项目分组
真实项目开发步骤: 多人同时开发项目,协作开发项目.分工合理.效率有提高(代码风格不一样.分工不好) 测试阶段 上线运行 对项目进行维护.修改.升级(单个人维护项目,十分困难,代码风格不一样) 项目稳 ...
- 【JavaScript】不使用正则表达式和字符串的方式来解析浏览器的URl地址信息
1.比如我们要获取的网站URl地址是:https://music.163.com/#/playlist?id=2384581760 一般我们能够想到的方式是直接使用正则表达式获取使用字符串直接解析的方 ...
- 详解Node解析URL网址
前提给大家声明一下,我操作的环境是Mac终端下操作的.(前提是你先要下载好node.js) 说道URL 恐怕都不陌生,但是要说URL,就 必须先说下URI URI是统一资源标识符,是一个用于标识某一互 ...
- URL地址中使用中文作为的参数【转】
原文:http://blog.csdn.net/blueheart20/article/details/43766713 引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作 ...
- VueJS取得URL参数
vuejs取得URL中参数的值 地址:http://localhost:3333/#/index?id=001 结果:001 console.log(this.$route.query.id)
- PHP的学习--解析URL
PHP中有两个方法可以用来解析URL,分别是parse_url和parse_str. parse_url 解析 URL,返回其组成部分 mixed parse_url ( string $url [, ...
随机推荐
- Rscripts的使用,以及如何为R脚本传参数
一.在windows下使用Rscript: 1.进入cmd.exe下,将当前工作目录转到Rscript.exe所在目录下面,然后调用Rscript **.R文件即可.但是所调用的.R文件必须是在R的 ...
- [hadoop读书笔记] Hadoop下各技术应用场景
1.数据采集 对于数据采集主要分为三类,即结构化数据库采集,日志和文件采集,网页采集. 对于结构化数据库,采用Sqoop是合适的,可以实现结构化数据库中数据并行批量入库到hdfs存储.对于网页采集,前 ...
- Qt中QString::toStdString().c_str() 偶尔存在问题
假设 QString str = "string"; const char* c = str.toStdString().c_str()单步调试显示的结果可能会是'\0' 而当我这 ...
- Java容器有哪些?
网易面试: 问:Java容器有哪些,你聊一聊吧 Java容器: 数组,String,java.util下的集合容器 数组长度限制为 Integer.Integer.MAX_VALUE; String的 ...
- Linux:Tomcat报错: Error creating bean with name 'mapScheduler' defined in ServletContext resource 的解决方法
2013-12-31 14:22:28 [ERROR] [ContextLoader.java->initWebApplicationContext(220) Context initializ ...
- python 读写二进制文件实例
本程序,首先写入一个矩阵到二进制文件中,然后读取二进制文件恢复到另外一个矩阵中. #coding:utf--8 #https://www.cnblogs.com/cmnz/p/6986979.html ...
- SAP FI 财务模块 关键用户 考试练习 问卷
FI概念部分课后练习:(20题, 开卷,本周五内完毕) PC端自我测试: http://www.xiaocar.net/index.php?s=/addon/Exam/Exam/show/exam_i ...
- Java如何删除数组中的元素?
Java中,如何删除数组元素? 示例 以下示例显示如何从数组中删除元素. package com.yiibai; import java.util.ArrayList; public class Re ...
- Response.Redirect与Server.Transfer区别-转
执行过程: 1.浏览器ASP文件请求->服务器执行->遇到response.redirect语句->服务器发送response.redirect后面的地址给客户机端的浏览器-> ...
- Git -- 分支管理简介
分支就是科幻电影里面的平行宇宙,当你正在电脑前努力学习Git的时候,另一个你正在另一个平行宇宙里努力学习SVN. 如果两个平行宇宙互不干扰,那对现在的你也没啥影响.不过,在某个时间点,两个平行宇宙合并 ...