通过 VUE watch监听实现中英文切换时元素样式改变

通过 VUE watch监听实现中英文切换时元素样式改变

1.前言

1.写项目的时候遇到的问题：新写的网页有中英文切换功能，但是当我切换成英文的时候，文本如果给定宽度，那么有时候翻译成英文文本会过长导致换行，可能会将原本下面的元素往下挤，所以我想要实现如下功能：一个元素有两套样式，当我进行中英文切换的时候样式也随之进行切换。

2.实现

之前有试过通过v-bind动态绑定style或class实现样式切换，但是这个方法只在刚开始渲染页面的时候会起效果所以当我进行中英文切换的时候并不会进行样式切换，只有在中英文切换后刷新页面也会起效果，后来通过使用Vue watch监听实现。代码如下所示:

<div class="identity"> 
     <p :class="flag==true?'changeClass1':'changeClass2'">{
   {
   $t('uc.safe.fundtip')}<