使用Vue.js和Axios从第三方API获取数据 — SitePoint

更多的往往不是，建立你的JavaScript应用程序时，你会想把数据从远程源或消耗一个[ API ]（https：/ /恩。维基百科。org /维基/ application_programming_interface）。我最近看了一些[公开]（https://github.com/toddmotto/public-apis API），发现有很多很酷的东西，可以从这些来源的数据。
通常情况下，在构建 JavaScript 应用程序时，您希望从远程源或从API获取数据。我最近研究了一些公开的API，发现可以使用这些数据源完成很多很酷的东西。更多来自作者的提示

• 快速提示：如何在JavaScript中排序对象数组

使用Vue.js，可以逐步地构建围绕其中一个服务的应用程序，并在几分钟内就可以开始向用户提供内容服务。
我将演示如何构建一个简单的新闻应用程序，它可以显示当天的热门新闻文章，并允许用户按照他们的兴趣类别进行过滤，从纽约时报API获取数据。您可以在这里找到本教程的完整代码。
下面是最终应用的外观：

要学习本教程，您将需要一些非常基本的Vue.js的知识。 您可以在这里找到一个很棒的“入门指南”。 我还将使用ES6语法，您可以到这里进一步学习：https://www.sitepoint.com/tag/es6/ 。项目结构
为了保持简单，我们只使用2个文件:

[code]./app.js

./index.html

[/code]

app.js

将包含我们应用程序的所有逻辑，

index.html

 文件将包含我们应用程序的主视图。
我们先在 

index.html

 中写一些基本的标记:

[code]



  

    

    

  

  

    


      
VueNews
 

    


  

[/code]
然后，在

index.html

的底部导入 

Vue.js

和

app.js

，就在

原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/255957.html