vue中操作Dom节点的方法

1.vue中ref操作dom节点

 

<template>
  <div id="app">
    <div ref="box">1111111111111111</div>
    <button @click="changeColor">改变</button>
  </div>
</template>

<script>
export default {
  name: "app",
  data() {
    return {
    };
  },
  methods:{
    changeColor() {
      this.$refs.box.style.color = 'red'
    }
  }
};
</script>

<style>

</style>

 页面效果：