Reactive Map and Set in Vue - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a reactive Map in Vue.

Vue

import { reactive } from 'vue';
const myMap = reactive(new [1]());

Drag options to blanks, or click blank then click option'

AMap

BSet

CArray

DObject

Attempts:

3 left

💡 Hint

Common Mistakes

Using Set instead of Map

Using Object instead of Map

We use Map to create a reactive map object in Vue.

2fill in blank

medium

Complete the code to add a key-value pair to a reactive Map.

Vue

myMap.[1]('name', 'Vue');

Drag options to blanks, or click blank then click option'

Aset

Bpush

Cadd

Dappend

Attempts:

3 left

💡 Hint

Common Mistakes

Using add instead of set

Using push which is for arrays

The set method adds or updates a key-value pair in a Map.

3fill in blank

hard

Fix the error in the code to check if a reactive Set contains a value.

Vue

const mySet = reactive(new Set());
const hasValue = mySet.[1]('Vue');

Drag options to blanks, or click blank then click option'

Acontains

Bincludes

Chas

Dfind

Attempts:

3 left

💡 Hint

Common Mistakes

Using contains which is not a Set method

Using includes which is for arrays

The correct method to check if a Set contains a value is has.

4fill in blank

hard

Fill both blanks to create a reactive Map and add a key-value pair.

Vue

import { reactive } from 'vue';
const map = reactive(new [1]());
map.[2]('framework', 'Vue');

Drag options to blanks, or click blank then click option'

AMap

BSet

Cset

Dadd

Attempts:

3 left

💡 Hint

Common Mistakes

Using Set instead of Map

Using add instead of set

Use Map to create the reactive map and set to add a key-value pair.

5fill in blank

hard

Fill all three blanks to create a reactive Set, add a value, and check if it exists.

Vue

import { reactive } from 'vue';
const set = reactive(new [1]());
set.[2]('Vue');
const exists = set.[3]('Vue');

Drag options to blanks, or click blank then click option'

AMap

BSet

Cadd

Dhas

Attempts:

3 left

💡 Hint

Common Mistakes

Using Map instead of Set

Using set instead of add

Using contains instead of has

Create a reactive Set, use add to add a value, and has to check if it exists.