【vue】vue入门-使用vue实现简单的一问一答小案例

首先引入vue的包:

本次案例除了引入vue的包外,还需要引入第三方的包:



首先我们找到一个接口: 

https://yesno.wtf/api


该接口是提供一个json接口,返回问题的答案yes或者no以及相应的动态图

html结构如下:


    

提出一个答案只能是Yes/No的问题:

{{ answer }}

然后我们创建一个Vue实例,使用watch对输入框进行监听。如果发生变化,则向https://yesno.wtf/api发起请求,并处理响应过来的json字符串。

运行结果如下:

当输入带?(英文的)的提问?就会发出请求

【vue】vue入门-使用vue实现简单的一问一答小案例_第1张图片


你可能感兴趣的:(⑤前端,------,vue,前端)