代码：

<div id="app">
    <input type="text" v-model="username">
    <p> {{ username }} </p>
    <p> {{ tips }} </p>
</div>

<script src="../vue-2.6.12.js"></script>
<script src="../axios.js"></script>
<script>
    const vm = new Vue({
        el: '#app',

        data: {
            username: '请输入用户名',
            tips: '' //提示用户名是否被占用
        },

        watch: {
            username(val) {
                if (val == '') return; //如果val为空字符串则不发请求
                const rusult = axios({
                    method: 'GET',
                    url: 'https://www.xxhzm.cn/api/username',
                    params: {
                        name: this.username
                            //name为vm中的username
                    }
                })

                rusult.then((val) => {
                    this.tips = val.data
                        //如果请求成功tips赋值为服务端返回的结果
                })

            }
        }
    })
</script>

关于axios请求服务端跨域的问题:

只需要在PHP文件中加入

header("Access-Control-Allow-Origin:*");
header("Access-Control-Request-Method: POST, GET");//这里为传输方式

演示地址: https://www.xxhzm.cn/vue/username/