veu小小算法|(幫解決問題)

某天一個朋友問我兩段話怎麼找出不一樣的字而後給顏色呢。 因而我就嘗試了下vue

<template>
    <div>
        <p>
            <span v-for="(item,index) of list1" :key="index" :class="{Cred:item.flag===false}">{{item.text}}</span>
        </p>
        <p>
            <span v-for="(item,index) of list2" :key="index" :class="{Cred:item.flag===false}">{{item.text}}</span>
        </p>
        
    </div>
</template>

<script>
import { mapMutations } from 'vuex'
export default {
  data () {
        return {
            p1:'我是陽光又帥氣的男生,我喜歡女生,咱們不同',
            p2:'我是可愛又美麗的女生,我喜歡男生,咱們有啥不樣',
            list1:[],
            list2:[],
           
        }
    },
    created () {
        this.getList()
    },
    methods: {
        // ...mapMutations({
        //     asideCur: `SET_ASIDE_CUR`
        // }),
        getList(){
            let len = this.p1.length < this.p2.length ?this.p2.length : this.p1.length
          
                for (let i = 0; i < len; i++) {
                    if (this.p1[i] === this.p2[i]) {
                        this.list1.push({
                            text: this.p1[i],
                            flag: true
                        })
                        this.list2.push({
                            text: this.p2[i],
                            flag: true
                        })
                    } else {
                        this.list1.push({
                            text: this.p1[i],
                            flag: false
                        })
                        this.list2.push({
                            text: this.p2[i],
                            flag: false
                        })
                    }
                }
                console.log(this.list1)
                console.log(this.list2)
        }
    },
    computed: {
        // ...mapGetters(['updateLeft'])
    },
    watch: {
       
    },
    filters: {

    }
}
</script>
<style>
.Cred{
    color: red  
}
</style>



複製代碼

代碼如上 它實現了這樣的效果vuex

可是代碼存在一個問題,就是同下標不一樣的字的能夠加上顏色,可是不能下標字不同的時候就出bug了,我也暫時想不出其餘辦法,但願掘友可以提供一個好的掘金辦法
相關文章
相關標籤/搜索