Fix readme

This commit is contained in:
MaxOvs19 2023-04-25 12:40:13 +03:00
commit 8fe132d7d1
2 changed files with 74 additions and 4 deletions

View File

@ -108,6 +108,41 @@ const App = () => {
};
```
### An example of initialization a CGSelect in Vue.
```javascript
<template>
<div>
<button class="cg-dropdown cg-dropdown_selector"></button>
</div>
</template>
<script>
import CGSelect from "cg-select";
export default {
mounted() {
const drop = new CGSelect({
selector: ".cg-dropdown_selector",
placeholder: "Выберите авто",
items: [
"BMW",
{
id: "213sade",
title: "Opel",
value: 1,
},
"Mersedes",
"MAN",
"Ferari",
],
});
console.log(drop);
},
};
</script>
```
## Example of different selects
<a href="https://cg-select.itguild.info/">View live example</a>
@ -132,8 +167,8 @@ All documentation on CG-SELECT is located in the folder of the same name. The do
| Application Compatibility | JS | React | Angular | Vue |
| ------------------------- | :----------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------: | :---------------------------------------------------------------------: |
| CG-SELECT | <img src="src/images/yes.png"></img> | <img src="src/images/yes.png"></img> | </img> <img src="src/images/no.png"></img> | </img> <img src="src/images/no.png"></img> |
| Comment | Tested in Js applications and it works. | The select is initiated inside the `useEffect() `hook | not yet available | not yet available |
| CG-SELECT | <img src="src/images/yes.png"></img> | <img src="src/images/yes.png"></img> | </img> <img src="src/images/no.png"></img> | </img> <img src="src/images/yes.png"></img> |
| Comment | Tested in Js applications and it works. | The select is initiated inside the `useEffect() `hook | not yet available | The select is initiated inside the `mounted() `hook |
## History

View File

@ -109,6 +109,41 @@ const App = () => {
};
```
### Пример инициализации CGSelect в Vue.
```javascript
<template>
<div>
<button class="cg-dropdown cg-dropdown_selector"></button>
</div>
</template>
<script>
import CGSelect from "cg-select";
export default {
mounted() {
const drop = new CGSelect({
selector: ".cg-dropdown_selector",
placeholder: "Выберите авто",
items: [
"BMW",
{
id: "213sade",
title: "Opel",
value: 1,
},
"Mersedes",
"MAN",
"Ferari",
],
});
console.log(drop);
},
};
</script>
```
## Примеры различных вариантов выбора.
<a href="https://cg-select.itguild.info/">Рабочий пример</a>
@ -129,8 +164,8 @@ const App = () => {
| Совместимость в приложениях | JS | React | Angular | Vue |
| --------------------------- | :----------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------: | :---------------------------------------------------------------------: |
| CG-SELECT | <img src="src/images/yes.png"></img> | <img src="src/images/yes.png"></img> | <img src="src/images/no.png"></img> | <img src="src/images/no.png"></img> |
| Комментарий | Протестировано в Js приложениях | Инициация селекта происходит внутри хука `useEffect()` | пока недоступно | пока недоступно |
| CG-SELECT | <img src="src/images/yes.png"></img> | <img src="src/images/yes.png"></img> | <img src="src/images/no.png"></img> | <img src="src/images/yes.png"></img> |
| Комментарий | Протестировано в Js приложениях | Инициация селекта происходит внутри хука `useEffect()` | пока недоступно | Инициация селекта происходит внутри хука `mounted()` |
## История