1. 程式人生 > 其它 >常見a標籤的錯誤及解決辦法

常見a標籤的錯誤及解決辦法

一、在a標籤中如果使用了 target=“_blank”

target=“_blank” 是一種有漏洞的使用方式

如果要用的話,那麼就需要加上 rel=“noopener noreferrer”>,用來阻止漏洞

<a href="http://baidu.com" target="_blank" ref="noopener noreferrer"></a>

二、修改配置

在這裡插入圖片描述

解決辦法

執行 npm run eject
//新增配置

//在package.json檔案中新增如下程式碼
"eslintConfig"
: { "extends": "react-app", "rules":{ "jsx-a11y/anchor-is-valid":"off" } }

三、a中沒有給任何的內容時會警告

例如:
在這裡插入圖片描述
出現警告
在這裡插入圖片描述

解決辦法

1.新增文字,並且在樣式中新增text-indent:-9999px; 使其跑出螢幕外面

<a href="#/" className="logo sprite_01">網易雲音樂</a>

在這裡插入圖片描述
2.新增空格

<a href="#/" className="logo sprite_01">  </a>