Google chrome 如何在Chrome开发工具监视面板中查看或滚动长表达式？_Google Chrome_Google Chrome Devtools_Watch

Google chrome 如何在Chrome开发工具监视面板中查看或滚动长表达式？

google-chrome google-chrome-devtools

Google chrome 如何在Chrome开发工具监视面板中查看或滚动长表达式？,google-chrome,google-chrome-devtools,watch,Google Chrome,Google Chrome Devtools,Watch,正如您在下面的屏幕截图中所看到的，我不得不尝试从一个很长的变量名中辨别出值。但由于某些原因，您无法水平滚动Chrome（v81）的监视面板以查看其余被截断的值。如果不尽可能地拉伸窗口，是否真的无法看到此值这是一个恼人的错误，它使手表面板在许多情况下无法使用此选项卡中此devtools会话期间的临时解决方法是通过在devtools上的devtools中运行以下代码来修补devtools本身切换到源面板展开Watch并确保至少存在一个表达式在devtools上打开devtools并运行以下

正如您在下面的屏幕截图中所看到的，我不得不尝试从一个很长的变量名中辨别出值。但由于某些原因，您无法水平滚动Chrome（v81）的监视面板以查看其余被截断的值。如果不尽可能地拉伸窗口，是否真的无法看到此值

这是一个恼人的错误，它使手表面板在许多情况下无法使用

此选项卡中此devtools会话期间的临时解决方法是通过在devtools上的devtools中运行以下代码来修补devtools本身

切换到

源

面板

展开

Watch

并确保至少存在一个表达式

在devtools上打开devtools并运行以下代码

关闭devtools上的devtools

（（）=>{
试一试{
UI.panels.sources
._watchSidebarPane[UI.View.widgetSymbol | | UI.View._widgetSymbol]
.\u watchExpressions[0]。\u element.getRootNode（）
.appendChild（document.createElement（'style'））.textContent=`
.观看表情标题{
显示器：flex；
}
.姓名{
最大宽度：50%；
溢出：隐藏；
文本溢出：省略号；
}
`;
}捕获（e）{
console.warn（'添加表达式并展开监视列表'）；
}
})();

为方便起见，您可以将代码保存在中，稍后再从中运行，或者在命令选项板中键入代码段名称（Ctrl-p或Cmd-p热键）

如何在devtools上打开devtools：

首先打开devtools，并在菜单中将其

停靠侧

切换到分离（浮动）窗口

在现在已拆下的devtools中，按CtrlShifti或⌘⌥我喜欢MacOS，
将在新窗口中的devtools上打开devtools

这是一个恼人的错误，使得手表面板在许多情况下无法使用