Set version as 3.8.0
parent
a04c9c74ad
commit
82afb526a6
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "primevue",
|
||||
"version": "3.7.3-SNAPSHOT",
|
||||
"version": "3.8.0",
|
||||
"homepage": "https://www.primefaces.org/primevue",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "primevue",
|
||||
"version": "3.7.3-SNAPSHOT",
|
||||
"version": "3.8.0",
|
||||
"homepage": "https://www.primefaces.org/primevue",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="layout-footer">
|
||||
<div class="layout-footer-left">
|
||||
<span>PrimeVue 3.7.3 on Vue 3 by </span>
|
||||
<span>PrimeVue 3.8.0 on Vue 3 by </span>
|
||||
<a href="https://www.primetek.com.tr">PrimeTek</a>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1116,9 +1116,10 @@ export default {
|
|||
so that the editing behavior is implemented by the page author whether it utilizes v-model or vuex.
|
||||
</p>
|
||||
|
||||
<p>Individuals cell editing is configured by setting the <i>editMode</i> to "cell" and defining editors with the "editor" template. The content of the
|
||||
editor defines how the editing is implemented, below example demonstrates two cases. In the first example, simple v-model editors are utilized. This is pretty straightforward in most cases.
|
||||
On the other hand, second example is more advanced to consider validations and ability to revert values with the escape key.</p>
|
||||
<p>Individual cell editing is configured by setting the <i>editMode</i> to <b>cell</b>, defining editors with the <b>editor</b> template along with the <i>@cell-edit-complete</i> event. The content of the
|
||||
editor defines how the editing is implemented. The editor template receives a clone of the row data and using <i>@cell-edit-complete</i> event the new value can be updated to the model or cancelled.
|
||||
This also provides flexibility to apply conditional logic such as implementing validations.</p>
|
||||
|
||||
<pre v-code><code><template v-pre>
|
||||
<h5>Cell Editing</h5>
|
||||
<DataTable :value="cars" editMode="cell" @cell-edit-complete="onCellEditComplete">
|
||||
|
@ -1216,7 +1217,8 @@ export default {
|
|||
|
||||
</code></pre>
|
||||
|
||||
<p>Row Editing is defined by setting <i>cellEdit</i> as "row", defining <i>editingRows</i> with the v-model directive to hold the reference to the editing rows and adding a row editor column to provide the editing controls. Note that
|
||||
<p>Row Editing is specified by setting <i>cellEdit</i> as <b>row</b>, defining <i>editingRows</i> with the v-model directive to hold the reference of the editing rows,
|
||||
adding a row editor column to provide the editing controls and implementing <i>@row-edit-save</i> to update the original row data. Note that
|
||||
since <i>editingRows</i> is two-way binding enabled, you may use it to initially display one or more rows in editing more or programmatically toggle row editing.</p>
|
||||
<pre v-code><code><template v-pre>
|
||||
<h3>Row Editing</h3>
|
||||
|
@ -1224,17 +1226,17 @@ export default {
|
|||
<Column field="vin" header="Vin"></Column>
|
||||
<Column field="year" header="Year">
|
||||
<template #editor="slotProps">
|
||||
<InputText v-model="slotProps.data[slotProps.column.field]" autofocus/>
|
||||
<InputText v-model="slotProps.data[slotProps.field]" autofocus/>
|
||||
</template>
|
||||
</Column>
|
||||
<Column field="brand" header="Brand">
|
||||
<template #editor="slotProps">
|
||||
<InputText v-model="slotProps.data[slotProps.column.field]" />
|
||||
<InputText v-model="slotProps.data[slotProps.field]" />
|
||||
</template>
|
||||
</Column>
|
||||
<Column field="color" header="Color">
|
||||
<template #editor="slotProps">
|
||||
<InputText v-model="slotProps.data[slotProps.column.field]" />
|
||||
<InputText v-model="slotProps.data[slotProps.field]" />
|
||||
</template>
|
||||
</Column>
|
||||
<Column :rowEditor="true" headerStyle="width:7rem" bodyStyle="text-align:center"></Column>
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
<p>PrimeVue is available at <a href="https://www.npmjs.com/package/primevue">npm</a>, if you have an existing application run the following commands to download PrimeVue and PrimeIcons to your project.</p>
|
||||
|
||||
<pre v-code.script><code>
|
||||
npm install primevue@^3.7.1 --save
|
||||
npm install primevue@^3.8.0 --save
|
||||
npm install primeicons --save
|
||||
|
||||
</code></pre>
|
||||
|
@ -87,12 +87,13 @@ import Dialog from 'primevue/dialog/sfc';
|
|||
<link href="https://unpkg.com/primeicons/primeicons.css" rel="stylesheet">
|
||||
|
||||
<script src="https://unpkg.com/vue@next"></script>
|
||||
<script src="https://unpkg.com/primevue/inputtext/inputtext.min.js"></script>
|
||||
<script src="https://unpkg.com/primevue/core/core.min.js"></script>
|
||||
<script src="https://unpkg.com/primevue/slider/slider.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<p-inputtext v-model="val"></p-inputtext>
|
||||
<p-slider v-model="val"></p-slider>
|
||||
<h6>{{val}}</h6>
|
||||
</div>
|
||||
|
||||
|
@ -108,11 +109,11 @@ import Dialog from 'primevue/dialog/sfc';
|
|||
};
|
||||
},
|
||||
components: {
|
||||
'p-inputtext': primevue.inputtext
|
||||
'p-slider': primevue.slider
|
||||
}
|
||||
};
|
||||
|
||||
createApp(App).mount("#app");
|
||||
createApp(App).use(primevue.config.default).mount("#app");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue