Vue.js中$refs{}如何获取DOM元素

<div id="app">
    <input type="button" value="获取元素" @click='btn'>
    <h3 id="myh3">哈哈, 今天天气不错</h3>
</div>

<script>
    var vm= new Vue({
        el:'#app',
        data:{},
        methods: {
            btn(){
                console.log(document.getElementById('myh3').innerText);
               
            }
        }
    })
    console.log(vm);
</script>

<h3 id="myh3" ref="myh3">哈哈, 今天天气不错</h3>

console.log(this.$refs.myh3);

console.log(this.$refs.myh3.innertext);
//或者
console.log(this.$refs.myh3.innerHtml);

<div id="app">
    <input type="button" value="获取元素" @click='btn'>
    <login ref='mylogin'></login>
</div>

<script>
    var login={
        template:'<h1>登录组件</h1>',
        data() {
            return {
                msg:'son msg'
            }
        },
        methods: {
            show(){
                console.log('调用了子组件的方法');
            }
        },
    }
    var vm= new Vue({
        el:'#app',
        data:{},
        methods: {
            btn(){
            }
        },
        components:{
            login
        }
    })
    console.log(vm);
</script>

console.log(this.$refs.mylogin);

this.$refs.mylogin.show();

console.log(this.$refs.mylogin.msg);