将样式指令值传递给Vuejs中的组件

7ivaypg9 于 2023-03-03 发布在 Vue.js

关注(0)|答案(1)|浏览(117)

我正尝试通过：style指令向共享按钮组件添加填充。由于某些原因，更改不会显示在按钮上。此共享组件根据不同的场景需要不同的填充，因此我无法直接在button.vue中添加它
我是Vuejs的新手，如果有人能提出这个问题，我将非常感激。

<Button
          @on-click="currentStep = 2"
          :text= "Next"
          :style="padding: 12px 15px 12px 15px"
        />

1条答案

如果您在Vue中绑定了一些东西，那么您传递的值就是JavaScript代码。
在您的情况下，padding: 12px 15px 12px 15px将被解释为JavaScript，它不是有效的JavaScript行。
所以如果你想传递一个文本，就在它两边加上引号，比如

:style="'padding: 12px 15px 12px 15px'"

您也可以传递一个对象

:style="{ padding: '12px 15px 12px 15px' }"

Playground
一个一个二个一个一个一个三个一个一个一个一个一个四个一个