vue手敲理解跳转
Posted 橘里橘气de
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue手敲理解跳转相关的知识,希望对你有一定的参考价值。
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> 7 <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"> 8 <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script> 9 10 <script src="vue.min.js"></script> 11 </head> 12 <body> 13 <div id="app"> 14 <App /> //vue根组件里的template渲染到标签里 填写一个msg 或者已近挂子过的参数即可 需要包裹多标签 15 <!--在根组件挂了 就可以直接用子--> 16 </div> 17 18 <script> 19 let App={ 20 data() { 21 return { 22 msg:\'hello word\' 23 } 24 }, 25 template:` 26 <div>{{ msg | reverse1 }}</div>`, 27 28 filters:{ 29 reverse1:function (value) { 30 console.log(value) 31 return value.split(\'\').reverse().join(\'\') //需要return filter等数据方法都要从当前文件等拿取 32 } 33 } 34 } 35 new Vue({ 36 el:\'#app\', 37 data(){ 38 return{ msg: 123 39 } 40 }, 41 template:` 42 <div class="app"> //vue根组件渲染到标签里 填写一个msg 或者已近挂子过的参数即可 43 <h1>{{ msg }}</h1> 44 <App/> 45 </div> 46 `, 47 components:{ 48 App 49 }, 50 }) 51 </script> 52 </body> 53 </html>
以上是关于vue手敲理解跳转的主要内容,如果未能解决你的问题,请参考以下文章