17、前端开发中的数据交互：Stimulus与React的实践

前端开发中的数据交互：Stimulus与React的实践

1. Stimulus中的Ajax调用与数据使用

1.1 Ajax调用基础

在现代JavaScript中，进行Ajax调用的简单机制是使用 fetch 函数和 async/await 语法来处理异步行为。 fetch 方法接受两个参数：要访问的URL和一个包含可选参数（如HTTP方法、请求体、数据等）的对象。其返回值是一个封装在JavaScript Promise中的 Response 对象。Promise是一个代表异步进程的JavaScript对象，该进程最终会执行，并可能在完成时返回数据。

以下是一个使用 then 链式调用处理异步操作的示例：

updateData() {
  fetch("/sold_out_concerts").then((response) => {
    response.text().then((text) => {
      // do something with text
    });
  });
}

当需要处理多个异步事件时，这种 then 链式调用会变得复杂。而 async 和 await 关键字的引入简化了异步进程的使用：