原文
Vue-inspired reactive building blocks for Flutter
Flutter Compositions brings Vue 3's Composition API patterns to Flutter, enabling fine-grained reactivity and composable logic with a clean, declarative API.
📚 Read the full documentation →
This repository uses a Melos-managed monorepo layout:
import 'package:flutter/material.dart';
import 'package:flutter_compositions/flutter_compositions.dart';
class CounterPage extends CompositionWidget {
const CounterPage({super.key});
@override
Widget Function(BuildContext) setup() {
// Reactive state
final count = ref(0);
final doubled = computed(() => count.value * 2);
// Side effects
watch(() => count.value, (value, previous) {
debugPrint('count: $previous → $value');
});
// Return builder
return (context) => Scaffold(
appBar: AppBar(title: const Text('Counter')),
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('Count: ${count.value}'),
Text('Doubled: ${doubled.value}'),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () => count.value++,
child: const Icon(Icons.add),
),
);
}
}- Vue-inspired API - Familiar
ref,computed,watch, andwatchEffect - Fine-grained reactivity - Powered by
alien_signals - Composable logic - Extract and reuse stateful logic with custom composables
- Type-safe DI -
provide/injectwithInjectionKey - Built-in composables - Controllers, animations, async data, and more
- Zero boilerplate - Single
setup()function replaces multiple lifecycle methods - Lint rules - Custom lints enforce best practices
This is a Melos monorepo. To get started:
# Install Melos
flutter pub global activate melos
# Bootstrap the workspace
melos bootstrap
# Run tests across all packages
melos run test
# Run analysis
melos run analyzecd packages/flutter_compositions/example
flutter runContributions are welcome! Please feel free to submit a Pull Request.
Flutter Compositions is built upon excellent work from the open source community:
- alien_signals - Provides the core reactivity system with fine-grained signal-based state management
- flutter_hooks - Inspired composable patterns and demonstrated the viability of composition APIs in Flutter
We are grateful to these projects and their maintainers for paving the way.
MIT © 2025