In the parent page create a javascript variable and set the values server-side
e.g.
<script> var translations = { Edit: "@ViewBag.EditTranslation", Select: "@ViewBag.SelectTranslation" }; </script>
ViewBag is only used here for illustration.
In the component define translations as a prop, specifying it’s type as Object. I’ve kept the other prop “rows” to show how multiple props are specified.
Vue.component('my-component', { props: { rows: Array, translations: Object } ...
In the component template use them like
{{ translations.Select }}
Or as attributes like
<i class="far fa-edit fa-sm" v-bind:title="translations.Edit"></i>
Then on the parent viewmodel pull the javascript data in.
var vmParent = new Vue({ data: { translations: translations }, ...
Then in the parent page bind the translations to the instance of the component
<my-component v-bind:translations="translations"></my-component>