个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在学习 VueJS 2.0，并且正在连接到一个 API，我希望某些数据的值在输入更改时发生更改。以下是使用开发工具的输出:
加拿大元:未定义
欧洲欧元:未定义
欧洲英镑:未定义
美元:“1232”
每当我在美元输入字段中输入 1232 时，它都不会返回任何内容，并将这些属性保留为未定义。这是代码。
new Vue({
el: '#app',
data: {
usd: '',
canadianDollar: '',
europeanPound: '',
europeanEuro: ''
},
// Watch methods
watch: {
usd: function() {
this.convertCurrency()
}
},
// Logic Methods
methods: {
convertCurrency: _.debounce(function() {
var app = this;
if (app.usd.length !== 0) {
// Show that the things are loading in.
app.canadianDollar = 'Searching...'
app.europeanPound = 'Searching...'
app.europeanEuro = 'Searching...'
console.log(app.usd)
axios.get("http://api.fixer.io/latest?base=USD&" + app.usd)
.then(function(response) {
app.canadianDollar = response.data.CAD
app.europeanPound = response.data.GBP
app.europeanEuro = response.data.EUR
})
.catch(function(error){
app.canadianDollar = "ERROR"
app.europeanPound = "ERROR"
app.europeanEuro = "ERROR"
})
}
}, 500)
}
})
和 HTML:
<!DOCTYPE html>
<html>
<head>
<title>Welcome to Vue</title>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<input type="text" name="" value="" v-model="usd">
<ul>
<li>Canadian Dollar: {{canadianDollar}}</li>
<li>European Pound: {{europeanPound}}</li>
<li>European Euro: {{europeanEuro}}</li>
</ul>
</div>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/lodash/4.17.4/lodash.min.js" charset="utf-8"></script>
<script src="index.js" charset="utf-8"></script>
</body>
</html>
当我输入数字时，它确实给了我“搜索”部分，但消失了并且没有任何显示。
最佳答案
我建议改变
then(function(response) {
app.canadianDollar = response.data.CAD
app.europeanPound = response.data.GBP
app.europeanEuro = response.data.EUR
})
至
then(function(response) {
console.log(response);
})
这样您就可以看到返回的内容。
此外，axios.get("http://api.fixer.io/latest?base=USD&"+ app.usd) 应该有一个类似 vulue 的名称:axios .get("http://api.fixer.io/latest?base=USD&VALUE="+ app.usd)，但你必须检查他们的 api 以了解它的含义。
关于javascript - VueJS api 调用留下数据未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41785710/
25
4
0
目前，我在单击我的正文时打开一个新选项卡，但它将焦点更改为子窗口。但我想通过留下窗口来做到这一点，这样弹出窗口就不会被阻止，并且我可以将焦点放在当前窗口上。 以下代码当前正在运行 /** * For
我有一个带有线性渐变的 css 背景图像。 CSS 代码: .footer-about { display: flex; align-items: center; justif
在服务中包含以下代码(假设在快速端点上): async function (res, req, next) { const fetch = require('node-fetch'); awa
我正在使用 IImageList 和 SHGetFileInfo 为任何给定路径提取巨型图标。一旦我有了它，然后我使用 DrawIconEx 将 HICON 渲染到 HBITMAP 中，最终使用 GD
我有图表并计算了网络密度，现在我应该只保留具有最大权重的分支(网络密度的前 10%，例如 200 中权重最大的 20 个分支)。我找不到该怎么做？ 最佳答案 这个问题有点令人困惑，因此，如果稍后出现更
我一直在尝试使用 jquery 创建一种效果，当您将鼠标移到一个 div 上时，整个 body 都会移动，并沿着它经过的点留下一条轨迹。我创建了一个可以使整个 body 移动的功能，但我找不到离开轨迹
我想在桌面上显示放大和缩小图标(控件)，而仅在移动设备上浏览时显示 gps 图标。我正在使用这个 css https://unpkg.com/leaflet@1.1.0/dist/leaflet.cs
相关代码(索引为数组大小): typedef struct elemento { unsigned long linha; unsigned long coluna; doub
我有一个 div，因此当我单击时，它会切换为展开或缩回。它在所有浏览器上都运行良好，尽管有一点让我很感兴趣。在谷歌浏览器上，当它缩回时，它会在运动中留下细线。 www.rezoluz.com/logi
每当我的应用程序尝试通过调用 CreateDIBSection() 或使用 LR_CREATEDIBSECTION 标志调用 LoadImage() 来创建 DIB 部分时，它似乎都会成功返回。它返回
我想在 Protractor 测试中脱离 Selenium 控制流。 以下是我迄今为止遇到的步骤和问题: 1。逐个测试禁用它 我的第一个想法是使用 SELENIUM_PROMISE_MANAGER 以
我正在构建一个部署在 CentOS 7.2 上的 ASP.Net Core (netcore 1.1) 应用程序。 我有一个通过 System.Diagnostics.Process 调用外部进程(也
我正在为我的网站创建一个聊天小部件。用户将能够输入纯文本 - 没有 html。 为了消除 HTML 标记并允许用户使用“”，我正在接受他们的输入并在用户屏幕的输入上使用 strip_tags() 和输
我是一名优秀的程序员,十分优秀！