ការប្រើ Template Syntax Vue js

អត្ថបទនេះ Techfree នឹងធ្វើការលើកយក របៀបប្រើប្រាស់ Template syntax នៅក្នុង Vue Js។ នៅក្នុងអត្ថបទនេះផងដែរ Techfree នឹងធ្វើការលើយក រូបមន្តមួយចំនួនយកមកធ្វើការបង្ហាញជូនលោកអ្នកដូចខាងក្រោម ៖

ការប្រើ v-bind:class ដែលប្រើនៅក្នុង attribute HTML សំរាប់ធ្វើការភ្ចាប់ជាមួយ css class
ការប្រើ v-one ដែលប្រើនៅក្នុង attribute HTML គឺសំរាប់កំនត់តម្លៃដោយមិនបានផ្លាស់ប្តូរទិន្នន័យ
ការប្រើ v-html ដែលប្រើនៅក្នុង attribute HTML គឺសំរាប់កំនត់ទំរង់បង្ហាញលក្ខណះជា HTML
ការប្រើ substr() គឺជា Method សំរាប់ធ្វើការកាត់ទៅលើអក្សរ
ការប្រើ Concat()គឺជា Method សំរាប់ធ្វើការទៅបន្ថែមទៅលើអក្សរconcat(“Text”)

ការប្រើ Fitter

ការបំលែង ទ្រង់ទ្រាយអក្សរ ទៅអក្សរតូច ឬ អក្សរធំ
```
{{ name| capitalize }}
```
ការប្រើប្រាស់រូបមន្តដូចជាការ គណនា {{ price * 0.2 }}

ដើម្បីអោយកាន់តែច្បាស់លោកអ្នកអាចធ្វើការអនុវត្តកូដដែល Techfree បានផ្តល់ជូនដូចខាងក្រោម៖

ធ្វើការបង្កើតរចនាសម្ព័ន្ធកូដ

បង្កើត Css File > css/style.css លោកអ្នកធ្វើការបញ្ចូលកូដដូចខាងក្រោម៖

2.សំរាប់ js File => js/vue.js វាជា Library មានស្រាប់របស់ Vue លោកអ្នកទាញយកមកពីគេហទំព័ររស់ Vue.js ជាការស្រេច។

3. បង្កើត js File > js/app.js លោកអ្នកធ្វើការបញ្ចូលកូដដូចខាងក្រោម៖

filters: គឺប្រើទៅការកំណត់ទំរង់ Text ហើយ Filters អាចប្រើប្រាស់បានពីរកន្លែង mustache interpolations and v-bind expressions។Filters គឺប្រើដោយសញ្ញា {{ message |capitalize }}។

4.បង្កើត HTML File > index.html លោកអ្នកធ្វើការបញ្ចូលកូដដូចខាងក្រោម៖