Options API
vue options, data(), export default { data, vue 2 styleDefinition
Vue’s original component shape — one object with data(), computed, methods, watch, props and the lifecycle hooks as named options — where the framework wires this so every option can reach every other; the way Vue 2 codebases are written and a way Vue 3 still supports in full
Easy to read at a glance and easy to teach, which is why it lasted: a newcomer can find the methods because they are under methods. The cost shows at scale — a feature’s logic is scattered across five options, and sharing it between components meant mixins, whose this collisions were the problem the Composition API was designed to end. A file that says export default { with data() inside is this; one that says <script setup> is the other. Migration is per component and gradual, and the two coexist in one app.
Organize by what kind of thing the code is. It reads like a form and scales like one: fine until the form is four screens long.