vue的小练习-翻转单词

先将字符串转成数组,用reverse()翻转数组,再转成字符串

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>
</head>

<body>
    <div id="app">
       <h2> {{string}}</h2>
        <button @click="reverse">逆转世界</button>

    </div>
    <script src="../../vue.js"></script>
    <script>
        const app = new Vue({
            el: '#app',
            data: {
                string:'Hello,world',
            },
            methods:{
                reverse(){
                    //先将字符串转成数组,用reverse()翻转数组,再转成字符串
                    this.string=this.string.split('').reverse().join('')
                }
            }
        })
    </script>
</body>

</html>
相关推荐
GDAL21 分钟前
HTML 中的 Canvas 样式设置全解
javascript
m0_5287238127 分钟前
HTML中,title和h1标签的区别是什么?
前端·html
Dark_programmer27 分钟前
html - - - - - modal弹窗出现时,页面怎么能限制滚动
前端·html
GDAL33 分钟前
HTML Canvas clip 深入全面讲解
前端·javascript·canvas
禾苗种树34 分钟前
在 Vue 3 中使用 ECharts 制作多 Y 轴折线图时,若希望 **Y 轴颜色自动匹配折线颜色**且无需手动干预,可以通过以下步骤实现:
前端·vue.js·echarts
GISer_Jing39 分钟前
Javascript排序算法(冒泡排序、快速排序、选择排序、堆排序、插入排序、希尔排序)详解
javascript·算法·排序算法
贵州数擎科技有限公司1 小时前
使用 Three.js 实现流光特效
前端·webgl
JustHappy1 小时前
「我们一起做组件库🌻」做个面包屑🥖,Vue的依赖注入实战💉(VersakitUI开发实录)
前端·javascript·github
拉不动的猪1 小时前
刷刷题16
前端·javascript·面试
kiramario1 小时前
【结束】JS如何不通过input的onInputFileChange使用本地mp4文件并播放,nextjs下放入public文件的视频用video标签无法打开
开发语言·javascript·音视频