Stylus是一個(gè)CSS預(yù)處理器，類似于Sass和Less，它可以使我們更輕松地編寫CSS代碼。Vue.js作為一個(gè)流行的前端框架，也支持使用Stylus來(lái)編寫樣式。

在Vue 2.0中，在組件中使用Stylus的方法非常簡(jiǎn)單。首先需要安裝Stylus的依賴，可以在命令行中運(yùn)行以下代碼：

npm install stylus stylus-loader --save-dev

安裝完成后，我們可以在組件的style標(biāo)簽中使用Stylus。例如：

<template>
<div class="example">
<h1>Hello World</h1>
</div>
</template>
<style lang="stylus">
.example
h1
color: #f00
</style>

在這個(gè)例子中，我們使用Stylus來(lái)設(shè)置.example類中的h1元素的文字顏色。注意，在style標(biāo)簽中，我們需要將lang屬性設(shè)置為"stylus"，以告訴Vue.js使用Stylus解析樣式。

除了基本的CSS屬性之外，我們還可以使用Stylus的許多特性來(lái)編寫更加高效和靈活的CSS。例如，變量和混合器：

$primary-color = #007bff;
.example
h1
color: $primary-color
.btn
background-color: $primary-color
border-radius()
border-radius: 5px
.button
mixin border-radius

在這個(gè)例子中，我們首先定義了一個(gè)變量$primary-color，并將其設(shè)置為藍(lán)色。然后我們使用該變量來(lái)設(shè)置.example類中的h1元素和.btn類的背景顏色。接下來(lái)，我們定義了一個(gè)名為border-radius的混合器，并在.button類中使用它來(lái)添加圓角樣式。

除了變量和混合器，Stylus還支持嵌套樣式和條件語(yǔ)句：

.example
h1
color: #f00
p
color: #000
if $primary-background-color == 'light'
background-color: #fff
else
background-color: #000

在這個(gè)例子中，我們使用嵌套樣式來(lái)設(shè)置.example類中的h1和p元素的樣式。我們還使用了一個(gè)條件語(yǔ)句，根據(jù)變量$primary-background-color的值不同來(lái)設(shè)置p元素的背景顏色。

總之，使用Stylus編寫Vue.js組件的樣式非常方便和靈活。Stylus支持許多有用的功能，如變量，混合器，嵌套樣式和條件語(yǔ)句等，可以大大提高CSS的編寫效率。