<template>
  <!-- 用户协议 -->
  <div style="">
    <div style="background: white;padding: 50px 300px;" v-html="html"></div>
  </div>
</template>

<script>

export default {
  props:['id'],
  data() {
    return {
      html: '',
      htmlPath: {
        1:'./UserAgreement.html',
        2:'./PrivacyPolicy.html',
        3:'./translate.html'
      }
    }
  },
  watch: {
    id(val) {
      this.fetchHtmlFile(val)
    },
  },
  mounted() { 
    this.fetchHtmlFile(this.id)
  },
  methods: {
    async fetchHtmlFile(id) {
      var url = this.htmlPath[id]
      await fetch(url).then(res =>  res.text() ).then(data => {
        this.html = data     
      })
    },
  },
}
</script>

<style scoped></style>