ES6字符串模板

这里做个简单的拓展，之前做vue组件时，经常用到拼接字符串，换行时用到\，既费时又麻烦。这里介绍个ES6字符串模板方法

旧版拼接（各种换行拼接）

        Vue.component('obj-prop',{
            props:['blog'],
            template:'\
                        <div class="obj_prop_div"><h2>{{blog.name}}</h2>\
                        <p>内容为：{{blog.content}}</p>\
                        <p>作者为：{{blog.author}}</p>\
                        </div>\
                    '
        });

新版方法（里面直接换行，不用拼接）

        Vue.component('obj-prop',{
            props:['blog'],
            template:`
                        <div class="obj_prop_div"><h2>{{blog.name}}</h2>
                        <p>内容为：{{blog.content}}</p>
                        <p>作者为：{{blog.author}}</p>
                        </div>
                    `
        });

 

输入`方式：CapsLk + ~，即可输出`

 

 

 

.