Angular中input自动获取焦点采坑

坑的样子

为了用户体验,我想着用户打开页面时输入用户名的框自动得焦,于是我就直接在input框中加了autofocus属性,结果是这样的:

Angular中input自动获取焦点采坑


代码虽然是写了,但是input还是没有聚焦,而且控制台还报了一句话

Angular中input自动获取焦点采坑

大概意思是 因为文档的URL有一个片段“#/login”,所以自动对焦处理被阻止 纳尼!!!


填坑中

既然自动获取焦点行不通,那就自己手动来吧,先给input打上标签

Angular中input自动获取焦点采坑


接着就拿到这个标签再把input的focus**试试?试试就试试!

Angular中input自动获取焦点采坑


代码中的 isPlatformBrowser 来判断当前平台是浏览器还是服务器(服务器渲染运行在 Node 环境中)

Angular中input自动获取焦点采坑

结果还真的可以,希望能够帮助到需要的同志吧。