Currently, I am developing a web application where users can input objects into a database. The structure of these objects is predefined, but some have a data property that contains a map of strings, for instance
{ title: "Test", description: "Description" }constructor, __proto__, and __ob__.
I am facing a dilemma regarding the data type to use for the data property in storing the database objects within a Vue 2 component for reactivity purposes. Here are some options I'm considering:
- Traditionally, I would opt for a null-prototype object for the
dataproperty by creating it usingObject.create(null). While this approach may allow keys likeconstructorand__proto__to function without issues, there could be complications with the__ob__property added by Vue. Deleting this property might not bode well with Vue, possibly leading to its reappearance. - The ideal method would involve utilizing ES6 maps. However, Vue 2 does not currently support this feature, rendering them non-reactive.
- An alternative solution could consist of implementing or devising a custom class mimicking ES6 maps but internally storing data in an array or another format compatible with Vue's reactivity system. Despite the availability of numerous ES6 map polyfills, pinpointing one seamlessly integrating with Vue's reactivity remains uncertain.
In light of these considerations, what would represent the most effective means of storing a user-defined key-valued map within a reactive Vue 2 object?