ES6——模板字符串

113 阅读1分钟
export default {
  name: 'Search',
  data() {
    return {
      keywords: ''
    }
  },
  methods: {
    searchUsers() {
      //请求前更新list的数据
      this.$bus.$emit('updateListData', {
        isFirst: true,
        isLoading: false,
        errorMsg: '',
        users: []
      });
      axios.get(`https://api.github.com/search/users?q=${this.keywords}`).then(
        response => {
          console.log('请求成功了');
          // 请求成功后更新数据
       
        },
        error => {
          console.log('请求失败了', error.message);
          // 请求失败后更新数据
   
        }
      )
    }
  },
}

动态获取输入框的keywords

    <div>
      <input
        type="text"
        placeholder="enter then name you search"
        v-model="keywords"
      />&nbsp;
      <button @click="searchUsers">Search</button>
    </div>

将其转化成ES6写法,其实非常简单: 只需把最外围的双引号(")或者单引号(') 转化成反引号(`)即可。

如果想在字符串内部使用反引号,只需使用反斜杠( )转义即可

let message =`这只小老鼠的名字是\`杰瑞\``;
console.log(message); 
输出:这只小老鼠的名字是`杰瑞`