Allow passing a read-only props as context
tcitworld opened this issue · 2 comments
tcitworld commented
vue3-gettext
version:2.0.0-alpha.3
vue
version:3.2.27
<template>
<div>
<p v-translate="{ indexName }" >
<strong>%{indexName}</strong> something something something
</p>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
props: {
indexName: {
type: String,
required: true,
},
},
})
</script>
Gives
[Vue warn]: Attempting to mutate prop "indexName". Props are readonly.
The trace points to
Line 33 in 65e5581
lzurbriggen commented
@tcitworld I believe the issue is that indexName
is already in the translation context (binding.instance
), which means you could use the directive without manually passing it:
<p v-translate>
<strong>%{indexName}</strong> something
</p>
or rename the parameter:
<p v-translate="{ name: indexName }" >
<strong>%{name}</strong> something
</p>
So I don't really consider this a bug, but I see how it can be confusing. I'll try to update the documentation.
As a heads up: I'll probably deprecate (but not remove) the directive and components soon. I will document the reasons when it comes to that.
tcitworld commented
That's correct, thanks!