VUE框架反转输入的信息效果实现------VUE框架

╰+哭是因爲堅強的太久メ 2024-02-17 11:16 57阅读 0赞

> ###  ###
> 
>     <!DOCTYPE html>
>     <html lang="en">
>     <head>
>         <meta charset="UTF-8">
>         <meta name="viewport" content="width=device-width, initial-scale=1.0">
>         <title>Document</title>
>         <script src="js/vue.js"></script>
>     </head>
>     <body>
>         <div id="app">
>             <h1>{
>         {msg}}</h1>
>             <input type="text" v-model:value="info"/>
>             <br>
>             <h1>反转的信息:{
>         {info.split('').reverse()}}</h1>
>         </div>
>         <script>
>             const vm = new Vue({
>                 el : "#app",
>                 data : {
>                     msg : "Heelo",
>                     info : ""
>                 }
>             });
>         </script>
>     </body>
>     </html>
> 
> <!DOCTYPE html>
> 
> <html lang="en">
> 
> <head>
> 
> <meta charset="UTF-8">
> 
> <meta name="viewport" content="width=device-width, initial-scale=1.0">
> 
> <title>Document</title>
> 
> <script src="js/vue.js"></script>
> 
> </head>
> 
> <body>
> 
> <div id="app">
> 
> <h1>\{ \{msg\}\}</h1>
> 
> <input type="text" v-model:value="info"/>
> 
> <br>
> 
> <h1>反转的信息:\{ \{info.split('').reverse()\}\}</h1>
> 
> </div>
> 
> <script>
> 
> const vm = new Vue(\{
> 
> el : "\#app",
> 
> data : \{
> 
> msg : "Heelo",
> 
> info : ""
> 
> \}
> 
> \});
> 
> </script>
> 
> </body>
> 
> </html>