小编Aay*_*shi的帖子

我有一个组件，我在其中进行挂载 API 调用

import * as React from 'react';
import axios from 'axios';
import './index.scss';
// import {axiosInstance} from '../../mocks/index';

// axios(client)
// axiosInstance(axios);
const FeatureTable = () => {
   React.useEffect(() => {
    axios.get("http://localhost:8080/users").then(function (response: any) {
      console.log(response.data);
    });
  }, []);

  return (
    <div className="container">
  </div>
  )
}

export default FeatureTable;

我已经在不同的文件夹中设置了我的模拟适配器，如下所示

const Axios = require("axios");
const MockAdapter = require("axios-mock-adapter");
import featureTable from './table';

export const axiosInstance = Axios.create();
const mock = new MockAdapter(axiosInstance, { delayResponse: 1000,  onNoMatch: "throwException"  }); …

我正在尝试使用 window.requestAnimationFrame() 来做一个简单的动画。不知何故，该函数没有被递归调用，也没有给出正确的代码。我文件的 javascript 代码是：

function OilPainting(){
  this.initialize=function(){
     var x=100;
    var canvas=document.getElementById("canvas");
    canvas.width=window.innerWidth;
    canvas.height=window.innerHeight;

  var context=canvas.getContext('2d');
    animate(canvas,context);
  }
}

var x=100;
var animate=function(canvas,context){
   window.requestAnimationFrame(animate);
  console.log("a");
  //console.log("a");
  /*for(var i=0;i<1;i++){
    var x=Math.random()*window.innerWidth;
    var y=Math.random()*window.innerHeight;
  context.beginPath();
  context.arc(x,y,30,0,2*Math.PI);
  context.stroke();
  //console.log("here");
    x+=1;*/

  context.beginPath();
  context.arc(x,100,30,0,2*Math.PI);
  context.clearRect(0,0,innerWidth,innerHeight);
  //console.log(x);
  context.stroke();
  x+=100;
 // console.log(x);
  }  
var app=new OilPainting();
app.initialize();

在这里，虽然控制台 a 被递归打印，但圆圈没有形成。我的 Codepen 的链接在这里。 requestAnimationFrame() 到底是如何使用的？