带有变量赋值的基本 vue.js 2 和 vue-resource http get

2023-11-23

我真的很难让最基本的 REST 功能在 vue.js 2 中工作。

我想从某个端点获取数据并将返回值分配给我的 Vue 实例的变量。这是我已经走了多远。

var link = 'https://jsonplaceholder.typicode.com/users';
var users;

Vue.http.get(link).then(function(response){
    users = response.data;
}, function(error){
    console.log(error.statusText);
});

new Vue ({
    el: '#user-list',
    data: {
        list: users
    }
});

在承诺内,我可以访问响应数据,但我似乎无法将其分配给用户,甚至无法分配给 Vue 实例的数据。

不用说,我对 vue.js 完全陌生,感谢您的帮助。

堆栈:vue.js 2.03,vue-资源 1.0.3

Cheers!


您可以创建一个对象并将其传递给 vue 实例,如下所示:

var link = 'https://jsonplaceholder.typicode.com/users';
var data = { 
    list: null 
};

Vue.http.get(link).then(function(response){
    data.list = response.data;
}, function(error){
    console.log(error.statusText);
});

new Vue ({
    el: '#app',
    data: data 
});

或者您可以在methods对象下创建一个函数,然后在挂载的函数中调用它:

var link = 'https://jsonplaceholder.typicode.com/users';
new Vue ({
    el: '#app',
    data: {
        list: null
    },
    methods:{
        getUsers: function(){
            this.$http.get(link).then(function(response){
                this.list = response.data;
            }, function(error){
                console.log(error.statusText);
            });
        }
    },
    mounted: function () {
        this.getUsers();
    }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

带有变量赋值的基本 vue.js 2 和 vue-resource http get 的相关文章

  • React js Stripe 结账不起作用

    我正在尝试在 React js 应用程序中呈现条带结账默认表单
  • jquery.find() 可以只选择直接子项吗?

    我应该向 jQuery find 提供什么参数来选择元素子元素而不选择其他元素 我不能用 gt 引导选择器 而用 将选择所有后代 而不仅仅是直接子代 我知道 jQuery children 但这是一个库 因此用户能够提供自己的选择器 并且我
  • Web 串行 API - 未捕获(承诺中)DOMException:无法打开串行端口/所需成员 baudRate 未定义

    下面的代码可以在我的 Xubuntu 机器上运行 但现在我在 Kubuntu 上 它不再工作了 它不会打开端口 Arduino IDE 工作正常 可以向开发板写入代码 并且我可以在 Chrome 中选择设备 Arduino Uno 但当我尝
  • 在 Vue.js 中从父组件执行子方法

    目前 我有一个 Vue js 组件 其中包含其他组件的列表 我知道使用 vue 的常见方式是将数据传递给孩子 并从孩子向父母发出事件 但是 在这种情况下 我想在子组件中的按钮出现时执行子组件中的方法 parent被点击 哪种方法最好 一种建
  • 解析“流”JSON

    我在浏览器中有一个网格 我想通过 JSON 将数据行发送到网格 但浏览器应该在接收到 JSON 时不断解析它 并在解析时将行添加到网格中 换句话说 在接收到整个 JSON 对象后 不应将行全部添加到网格中 应该在接收到行时将其添加到网格中
  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一
  • 如何抑制窗口鼠标滚轮滚动...?

    我正在开发嵌入页面中的画布应用程序 我有它 因此您可以使用鼠标滚轮放大绘图 但不幸的是 这会滚动页面 因为它是文章的一部分 当我在 dom 元素上滚动鼠标滚轮时 是否可以阻止鼠标滚轮在窗口上滚动 附加鼠标滚轮 不是 Gecko DOMMou
  • 除了更改标题之外,如何在 Firefox 中强制另存为对话框?

    有没有办法在 ff 中强制打开 www example com example pdf 的另存为对话框 我无法更改标题 如果您可以将文件以 Base64 格式输出到客户端 则可以使用 data uri 进行下载 location href
  • 如何将 Google Charts 与 Vue.js 库一起使用?

    我正在尝试使用 Vue js 库使用 Google Charts 制作图表 但我不知道如何添加到 div 这是我尝试做的 这是如何使用普通 javascript 添加图表 这是文档的代码示例 https developers google
  • 使用 KnockoutJs 映射插件进行递归模板化

    我正在尝试使用以下方法在树上进行递归模板化ko映射 插入 http knockoutjs com documentation plugins mapping html 但我无法渲染它 除非我定义separate每个级别的模板 在以下情况下
  • MVC 在布局代码之前执行视图代码并破坏我的脚本顺序

    我正在尝试将所有 javascript 包含内容移至页面底部 我正在将 MVC 与 Razor 一起使用 我编写了一个辅助方法来注册脚本 它按注册顺序保留脚本 并排除重复的内容 Html RegisterScript scripts som
  • Babel 7 Jest Core JS“TypeError:wks不是函数”

    将我的项目升级到 Babel 7 后 通过 Jest 运行测试会抛出以下错误 测试在 Babel 6 中运行没有任何问题 但在 Babel 7 中失败并出现以下错误 TypeError wks is not a function at Ob
  • 如何获取 vuejs 组件单元测试中定义的“this”变量

    我正在尝试在 npm 脚本中使用 mocha webpack 来测试 vuejs 组件 我在测试中像这样嘲笑 vuex 商店 const vm new Vue template div div
  • 如何使输入字段和提交按钮变灰

    我想变灰这两件事 http doorsplit heroku com 歌曲输入字段和提交按钮 直到用户输入艺术家 有没有一种简单的方法可以通过 JQuery 来做到这一点 艺术家输入字段的id是 request artist 你可以这样做
  • Firefox 书签探索未超过 Javascript 的第一级

    我已经编写了一些代码来探索我的 Firefox 书签 但我只获得了第一级书签 即我没有获得文件夹中的链接 e g 搜索引擎 雅虎网站 谷歌网站 在此示例中 我只能访问 Search engines 和 google com 不能访问 yah
  • Laravel 中只向登录用户显示按钮

    如果我以 John 身份登录 如何才能只显示 John 的红色按钮而不显示 Susan 的红色按钮 测试系统环境 Win10 Laravel5 4 Mysql5 7 19 table class table table responsive
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • Javascript转换时区问题

    我在转换当前时区的日期时间时遇到问题 我从服务器收到此日期字符串 格式为 2015 10 09T08 00 00 这是中部时间 但是当我使用 GMT 5 中的 new Date strDate 转换此日期时间时 它返回给我的信息如下 这是不
  • Safari 支持 JavaScript window.onerror 吗?

    我有一个附加到 window onerror 的函数 window onerror function errorMsg url line window alert asdf 这在 firefox chrome 和 IE 中工作正常 但在 s
  • 使用 Ajax 请求作为源数据的 Jquery 自动完成搜索

    我想做的事 我想使用 jquery 自动完成函数创建一个输入文本字段 该函数从跨域curl 请求获取源数据 结果应该与此示例完全相同 CSS 在这里并不重要 http abload de img jquerydblf5 png http a

随机推荐

  • 如何跟踪WPF中TextBox中的哪个字符被删除?

    我想跟踪用户通过Delete或BackSpace键删除了哪个字符 我正在处理文本框的 TextBox ChangedEvent 我可以从中提取删除的字符吗文本更改事件参数 e 变更如果是的话我该怎么做 我想限制用户从文本框中删除任何字符 我
  • 如何更改 xcode 中的 subversion 设置?

    我已经在 Xcode 中运行了 subversion 一段时间 subversion 的集成始终悬而未决 然而我的 subversion 服务器已经改变了它的 ip 地址 并且我的 xcode 项目仍然尝试在旧 ip 上查找源 我已经通过
  • Prolog:带有内置命令的“Vanilla”元解释器

    这个答案Jan Burse 展示了 Prolog 中元解释器最简单的实现之一 solve true solve A B solve A solve B solve H clause H B solve B 我想扩展这个解释器 以便它可以调用
  • 如何将cURL转换为axios请求

    我正在尝试将 cURL 请求转换为here到 axios curl d grant type client credentials client id YOUR APPLICATION S CLIENT ID client secret Y
  • 具有多客户端通信的 Java 服务器。

    我正在为一项任务制作一个游戏 我有一个用 Java 设置的服务器和多客户端 我们使用的是 MVC 我需要让客户端将他们的名字发送到服务器 然后当有两个玩家存在时 我需要将两个名字以及他们的玩家编号 玩家一或玩家二 发送回客户端 我不明白如何
  • 如何在 C# 中的控制台窗口上显示列表项

    我有一个List包含所有数据库名称 我必须在控制台中显示该列表中包含的项目 使用Console WriteLine 我怎样才能实现这个目标 实际上你可以做得很简单 因为列表有一个ForEach方法 因为你可以传入Console WriteL
  • Python Tornado - 困惑如何将阻塞函数转换为非阻塞函数

    假设我有一个长时间运行的函数 def long running function result future Future result 0 for i in xrange 500000 result i result future set
  • { } 和等号变量之间的区别

    我对 C 编程有点陌生 我在谷歌上找不到我的答案 所以希望它能在这里得到答案 以下之间有区别吗 unsigned int counter 1 or unsigned int counter 1 这本书使用了第一个选项 它让我感到困惑 因为它
  • 检查 typescript 类是否有 setter/getter

    我有一个打字稿类 它具有以下属性 export class apiAccount private balance apiMoney get balance apiMoney return this balance set balance v
  • 在iPhone上,是否可以查出我们连接的是哪个WIFI网络?

    如果是的话 我们还可以获得有关网络配置的其他信息吗 一种有用的方法是获取当前网络的 SSID 有 API 可以做到这一点吗 更新 我在这里发现了类似的问题 iPhone SDK能否获取当前连接的Wi Fi SSID 尝试以下方法 impor
  • Java 可变长度参数与数组,简单的语法糖?

    我正在当地社区大学学习数据结构和算法课程 以获取乐趣 该课程的教材是Y Daniel Liang的Java 编程简介 第 10 版 这本书本身非常扎实 在处理Java util Arrays Liang提到了Java的 可变长度 参数 他写
  • Three.js 鼠标按下时旋转对象并移动

    我试图在场景中获得良好的鼠标移动 以便我可以围绕对象旋转 我有两个问题 我可以弄清楚如何限制运动 使其永远不会在 Y 轴上旋转低于 0 度 我不想从下面看到物体 只想从上面看到 而我想不通的第二件事就是如何让动作变得流畅 现在我在 jsfi
  • 如何在Spring中进行条件自动装配?

    有没有人尝试过根据条件将不同的 bean 自动连接到 Spring 管理的 bean 中 例如如果满足某些条件 则注入A类 否则注入B类 我在 Google 搜索结果之一中看到可以使用 SpEL Spring 表达式语言 但无法找到工作示例
  • 使用 terraform 获取 Route53 上托管域的 zone_id

    您好 我正在使用 terraform 创建 Route53 记录 我已经有一个托管域 公共 可以说example com如何获取其 zone id 并附加到记录 如何获取现有 Route53 托管区域的 zone id 我已经编写了一个文件
  • SQL如何比较两个不同表中的两列

    我有两个表 其中表 1 包含 4 列 表 2 包含 8 列 我在 table1 中有两列 我想将它们与 table2 中的两列进行比较 Table 1 have column1 and column2 that needs to be co
  • 由于 PHP 版本,Apache 中的 PHPMyAdmin 500 内部服务器错误

    Version OS lsb release a Ubuntu 18 04 5 LTS PHP php v 8 0 1 Apache apache2 v 2 4 29 Ubuntu MySQL mysql version mysql 版本
  • 如何最小起订量功能

    尝试对其构造函数采用 Func 的类进行单元测试 不知道如何使用 Moq 来模拟它 public class FooBar public FooBar Func
  • 如何防止使用 Git 自动合并?

    我正在尝试将本地分支合并到主分支中 而无需 Git 进行自动合并 我想 手工挑选 我想要合并到 master 中的内容 当我使用 Git 的 difftool 命令时 我可以比较并选择要添加到 master 分支中的内容 但是当我进行合并时
  • 当属性可以抛出异常时对象初始值设定项和 Dispose

    我有以下设置 public class SomeClass private DirectoryEntry root private DirectorySearcher searcher public SomeClass root new D
  • 带有变量赋值的基本 vue.js 2 和 vue-resource http get

    我真的很难让最基本的 REST 功能在 vue js 2 中工作 我想从某个端点获取数据并将返回值分配给我的 Vue 实例的变量 这是我已经走了多远 var link https jsonplaceholder typicode com u