vue实现引入本地json的方法分析
作者：佑之以航 发布时间：2023-07-02 16:32:14
标签：vue,json
本文实例讲述了vue实现引入本地json的方法。分享给大家供大家参考，具体如下：
当前需要使用的组件：
import data from './test.json'
export default{
data(){
return{
userinform: ''
}
},
mounted(){
this.userinform = data
}
}
test.json就是普通json格式就可以了！然后完美解决！
后台服务器请求json方式：
this.$http.get('url').then(response => {
//succces callback
var data = response.body;
}, response => {
// error callback
alert('连接失败！')
});
附：VUE解析json展示列表页示例
<div class="padding">
<div id="app">
<ol>
<li v-for="site in sites">
{{ site.name }}
</li>
</ol>
</div>
</div>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
<script>
function getJson(url,func){ $.ajax({ type:'get', url:url, dataType: 'json', success: function(data){ if (data.code==0){ var a = data.data.list;func(a); }else{ alert("接口调用失败"); } }, error: function(data){ alert(JSON.stringify(data)); } }); }
$(function(){ var url = "http://www.test.com/index.php?s=/shop/list/"; getJson(url,pushDom); });
function pushDom(data){ var vm = new Vue({
el: '#app',
data: {
sites: data
}
})}
</script>
希望本文所述对大家vue.js程序设计有所帮助。
来源：https://www.cnblogs.com/yzyh/p/7422989.html
0
投稿猜你喜欢
- 第一步肯定是打上SQL SERVER最新的安全补丁.如果这一步都没有做好，那我们也没有继续下去的必要了。 第二步是修改默认的1433端口，并
最近在学习python爬虫，看到网上有很多关于模拟豆瓣登录的例子，随意找了一个试了下，发现不能运行，对比了一下代码和豆瓣网站，发现原来是豆瓣- 近日在学习C++，看到函数指针，由于之前一直搞ASP，所以想ASP里面是否也有这个函数指针的东西，于是翻了翻VBScript手册，没让我失望
- 现在有这样一个需求，内网有一个数据库服务，需要将外网的数据库导入到内网数据库。将外网的数据库导出sql文件有700MB+,用MySQL自带的
- Python的from import *和from import *，它们的功能都是将包引入使用，但是它们是怎么执行的以及为什么使用这种语法
- 一、SQLite简介SQLite是一个包含在C库中的轻量级数据库。它并不需要独立的维护进程，并且允许使用非标准变体(nonstandard
- 最近有同学询问如何利用Python处理xml文件，特此整理一个比较简洁的操作手册，供大家参阅。首先准备一个xml文件，xml中的内容如下所示
- 一个什么都不懂的家伙非跟我要个sql查询器 随便写了一个，当然为了数据安全，要过滤掉一个sql关键词和系统中的一些表了 哦，对了，里面的一些
- SQL 标准使用 CREATE TABLE 语句创建数据表；MySQL 则实现了三种创建表的方法，支持自定义表结构或者通过复制已有的表结构来
- [Q]怎么样查询特殊字符，如通配符％与_ [Q]如何插入单引号到数据库表中 [Q]怎样设置事务一致性 [Q]怎么样利用光标更新数据 [Q]怎
- 本文首先介绍了Python中的模块的概念，谈到了一个模块往往由多个模块组成，然后通过具体实例，分析了模块重载的相关内容，具体介绍如下。模块是
- 惭愧啊，今天写了个查找子串的Python程序被BS了…如果让你写一个程序检查字符串s2中是不是包含有s1。也许你会很直观的写下下面的代码：#
- MSXML是微软非托管代码栈中最为核心的XML服务集合，不但适合基于COM的开发应用，更是微软AJAX解决方案和客户端XSLT解决方案的核心
- JOIN对于接触过数据库的人，这个词都不陌生，而且很多人很清楚各种JOIN，还有很多人对这个理解也不是很透彻。假设我们有两个表，Table_
- 本文实例讲述了Golang算法问题之整数拆分实现方法。分享给大家供大家参考，具体如下：一个整数总可以拆分为2的幂的和，例如：7=1+2+47
- 本文以sql2012为例第一步，(查询日志中文件名和大小):USE 数据库名GOSELECT file_id, name,size,* FR
- 一、环境Ubuntu 16.04tensorflow 1.4.0keras 2.1.3二、训练数据时报错：ValueError: Error
- 简单介绍下：CSS 图片拼合 (CSS sprites) 可有效降低图片文件的 HTTP 连接请求数. 多个图片将以一定间距合并为一个大图片
- 调用bianli()函数,这里是遍历F:盘，bianli("F:\")'这里设置文件夹路径，你可以改为其它文件夹
- Create PROC P_viewPage
