問題背景
React開發的系統，收到一個BUG反饋，*“號個人統計”文字不正確，應為“個人號統計”*。
收到BUG后，打開瀏覽器查驗是什么情況，難道犯了最基本的錯誤，Ctrl C也能錯。
隨后還是查驗BUG：
1. 打開瀏覽器，發現我的瀏覽器上顯示“個人號統計”
2. 使用Chrome瀏覽器、Firefox、Edge 均為返現次情況
3. 查看代碼，確實是最普通的文字 ```<span>個人號統計</span>```
最后去找BUG的發起人，確認BUG的重現現象為：
1. Mac 系統 + Chrome瀏覽器
2. 只有Chrome瀏覽器才出現，Safari瀏覽器也未出現
3. 不只是某一個Mac + Chrome出現，在其他的同樣條件下出現了問題
問題截圖
問題產生原因和解決
經過排查，發現問題是chrome的一個翻譯功能導致的，在window + chrome下，主動點擊翻譯功能，即可重現同樣的問題。但是在mac + chrome 自動翻譯了。而且也沒提示當前處於翻譯模式下。
解決問題的根源是chrome 為什么會自動翻譯了。查看瀏覽器源代碼發現html lang="en"
<!DOCTYPE html>
<html lang="en">
<head></head>
<body></body>
</html>
瀏覽器檢測設置了當前html lang為en（英文）網頁，即為英文網頁，就根據地域、個人習慣，翻譯成本地的語言。本地語言也是中文，就出現了中文翻譯中文的情況。頁面其它的文字都沒有改變，只有某些文字出現了順序不正確，才導致的此次情況。
解決方法是將html 的lang移除，或設置為zh
<html lang="zh">
</html>
附chrome翻譯圖
-
錯誤情況
-
正常情況
總結
- 平時開發網頁時，沒有注意過html lang這個屬性
- 使用react 腳手架生成出來的index.html網頁被設置為html lang="en"，沒注意到