Location 对象

1. Location 对象

• Location 对象包含有关当前 URL 的信息。
• Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。

2. Location 对象属性

<!--作者：zhangfan
页面名称：Location 对象属性de使用方法--> 
<template>
  <div id="product-list-one">
    <button @click="locationBtn()">执行locationBtn</button>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex";
export default {
  data() {
    return {};
  },
  computed: {},
  methods: {
    locationBtn() {
      console.log(
        "==============" + "window.location.hash" + "==================="
      );
      console.log(window.location.hash);
      console.log(
        "==============" + "window.location.host" + "==================="
      );
      console.log(window.location.host);
      console.log(
        "==============" + "window.location.hostname" + "==================="
      );
      console.log(window.location.hostname);
      console.log(
        "==============" + "window.location.href" + "==================="
      );
      console.log(window.location.href);
      console.log(
        "==============" + "window.location.pathname" + "==================="
      );
      console.log(window.location.pathname);
      console.log(
        "==============" + "window.location.port" + "==================="
      );
      console.log(window.location.port);
      console.log(
        "==============" + "window.location.protocol" + "==================="
      );
      console.log(window.location.protocol);
      console.log(
        "==============" + "window.location.search" + "==================="
      );
      console.log(window.location.search);
    }
  }
};
</script>

<style scoped>
</style>

3. Location 对象方法

<!--作者：zhangfan
页面名称：Location 对象属性de使用方法--> 
<template>
  <div id="product-list-one">
    <button @click="assignBtn()">执行assignBtn</button>
    <button @click="reloadBtn()">执行reloadBtn</button>
    <button @click="replaceBtn()">执行replaceBtn</button>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex";
export default {
  data() {
    return {};
  },
  computed: {},
  methods: {
    assignBtn() {
      window.location.assign("http://www.baidu.com");
    },
    reloadBtn() {
      window.location.reload();
    },
    replaceBtn() {
      window.location.replace("http://www.baidu.com");
    }
  }
};
</script>

<style scoped>
</style>