the demo code is as follows:

test async</button>
    </div>

    <script>
        new Vue({
            el: "-sharpapp",
            methods: {
                // setTimeout
                getFoo() {
                    return new Promise((resolve, reject) => {
                        setTimeout(() => {
                            resolve()
                        }, 5000)
                    })
                },
                getBar() {
                    return new Promise((resolve, reject) => {
                        setTimeout(() => {
                            resolve()
                        }, 1000)
                    })
                },
                // getBarSuccessgetFooSuccess
                // resolvecallback
                getResult() {
                    this.getFoo().then(res => {
                        alert("getFooSuccess")
                    })
                    this.getBar().then(res => {
                        alert("getBarSuccess")
                    })
                },
                // getFooSuccessgetBarSuccess
                // barPromiseresolvealert("getBarSuccess")
                async getResult2() {
                    const fooPromise = this.getFoo()
                    const barPromise = this.getBar()
                    await fooPromise
                    alert("getFooSuccess")
                    await barPromise
                    alert("getBarSuccess")
                }     
            }
        })
    </script>
</body>

</html>

the problem encountered is:
now I want to change the getResult () method, which is called promise , to use ES7"s async/await . The hope is that there are two unrelated requests. Which request is completed first, which request"s callback is executed first, but it seems impossible to use async/await instead.
ask the bosses for advice, or is it impossible to use async/await in this scenario?
Thank you very much!