Vue报错：Uncaught RangeError: Maximum call stack size exceeded

参考了https://blog.csdn.net/baidu_38742725/article/details/106758271后解决了我的问题

解决错误

在写Vue组件的时候，容易将语法写错，如果像下面这样：

<div id="app">
    <cpn1></cpn1>
</div>
Vue.component('cpn1',{
        template: `
            <div>
                <h2>我是标题2</h2>
                <p>我是内容呵呵呵</p>
                <cpn1></cpn1>
            </div>`
    })

出错原因

在一个模版中调用自身是不对的，在模版template中反复地调用自己，结果不断递归导致堆栈的溢出。容易混淆的是：当组件中有子组件（component）时候，想要使用子组件，就要把子组件的名字作为一个标签，写到当前组件的template当中。

而没有子组件的时候，绝对不能将自身的名字，如上面栗子当中的cpn1，当成了子组件名字，写到自己的的template里面