Vue Values

# <StringValue />

A String value that gives you helpers like append, prepend, replace or substring.

# Props

Every Value's prop is available together with the following ones:

# Scoped props (default slot)

Every Value's scoped prop is available together with the following ones:

Scoped props Type Description
append(str) Function Appends another string to current one. Only if its not disabled.
prepend(str) Function Prepends another string to current one. Only if its not disabled.
insert(index, str) Function Inserts another string to current one at position given by index. Only if its not disabled.
replace(...args) Function Calls String.replace. Only if its not disabled.
substring(...args) Function Calls String.substring. Only if its not disabled.

# Events

Every Value's event is available.

# Example

Typed:

reset

 



 

 

 

 


 











<template>
	<StringValue #default="{ value, set, resetToDefault, reset }">
		<div class="demo demo-with-actions">
			<input
				type="text"
				:value="value"
				placeholder="Type something..."
				@input="set($event.target.value)"
			/>
			<p><b>Typed:</b> <span>{{ value }}</span></p>
			<div class="demo-actions">
				<a @click="reset">reset</a>
			</div>
		</div>
	</StringValue>
</template>

<script>
import { StringValue, BooleanValue } from 'vue-values'
import DisabledActionInput from '../DisabledActionInput'

export default {
	components: { StringValue, BooleanValue, DisabledActionInput },
}
</script>

← <ArrayValue /> →