Added a note about v-slot directive

1 files changed, 12 insertions, 2 deletions

diff --git a/doc/development/fe_guide/style_guide_js.md b/doc/development/fe_guide/style_guide_js.md
index 060cd8baf7f..94dfdbdd073 100644
--- a/doc/development/fe_guide/style_guide_js.md
+++ b/doc/development/fe_guide/style_guide_js.md
@@ -544,14 +544,24 @@ Please check this [rules][eslint-plugin-vue-rules] for more documentation.
       <component @click="eventHandler"/>
     ```
 
-1. Shorthand `:` is preferable over `v-bind`
+2. Shorthand `:` is preferable over `v-bind`
 
     ```javascript
       // bad
       <component v-bind:class="btn"/>
 
       // good
-      <component :class="btsn"/>
+      <component :class="btn"/>
+    ```
+
+3. Shorthand `#` is preferable over `v-slot`
+
+    ```javascript
+      // bad
+      <template v-slot:header></template>
+
+      // good
+      <template #header></template>
     ```
 
 #### Closing tags