如何在vue.js中使用@page css规则

我有一个页面希望以横向模式打印，如下所示：

@page {
    margin: 0;
    size: A4 landscape;
}

但是，由于我的所有文件的所有样式部分都捆绑在一起，因此这种样式会影响我应用程序中的每个页面

通常，我会为我的组件指定一个唯一的id，并使用该id更有选择性地应用样式：

@page {
    #my-unique-id{
        margin: 0;
        size: A4 landscape;
    }
}

但这是无效的，因为@page规则不能有任何进一步的选择器（逻辑上，因为它会影响整个页面，并且不能作为目标）

如何继续使此规则仅影响当前加载的页面，并使所有其他页面处于纵向模式？

标记可以位于HTML文档中的任何位置。因此，作为一种解决方法，您可以在

中添加

标记，如下所示：

@页面{
保证金：0；
大小：A4景观；
}
...

它可能不是最干净的解决方案，但它完成了任务，并且只在这一页上应用@page规则