019.Vue3入门,使用原生JS属性的方法

1、代码如下:

<template>
  <div ref="container" class="container">{{ caption }}</div>
  <input type="text" ref="username">
  <button @click="getElementHandle">获取元素</button>
</template>

<script>
export default {
  data() {
    return {
      caption: "好好学习",
    }
  },
  methods: {
    getElementHandle() {
      //在Vue3中使用原生JS属性
      this.$refs.container.innerHTML = "天天向上";
      console.log(this.$refs.username.value);
    }
  }
}
</script>

<style>
</style>

2、效果如下:

 

posted @ 2024-08-10 22:51  像一棵海草海草海草  阅读(4)  评论(0编辑  收藏  举报