docs: update example

Author: rzzf

docs/rules/no-literals-in-template.md

@@ -15,6 +15,7 @@ description: disallow object, array, and function literals in template
 
 This rule disallows object, array, and function literals in template `v-bind` directives.
 These literals are created as new references on every rerender, which can cause the child component's watchers to trigger unnecessarily even when the object hasn't actually changed.
+
 If the literal references a variable from a `v-for` directive or a scoped slot, it is ignored.
 
 <eslint-code-block :rules="{'vue/no-literals-in-template': ['error']}">
@@ -31,13 +32,16 @@ If the literal references a variable from a `v-for` directive or a scoped slot,
   <div :style="{ color: 'red' }" />
 
   <template v-for="i in arr">
-    <MyComponent :callback="() => someFunction(someArgs, i)" />
+    <MyComponent :data="[i]" />
     <MyComponent :data="{ index: i }" />
+    <MyComponent :callback="() => someFunction(someArgs, i)" />
   </template>
   
   <Child>
     <template #default="{ foo }">
+      <MyComponent :data="[foo]" />
       <MyComponent :data="{ val: foo }" />
+      <MyComponent :data="() => someFunction(someArgs, foo)" />
     </template>
   </Child>
 
@@ -50,13 +54,16 @@ If the literal references a variable from a `v-for` directive or a scoped slot,
   <div :callback="function() { return 1 }" />
 
   <template v-for="i in arr">
-    <MyComponent :callback="() => someFunction(someArgs, globalVars)" />
+    <MyComponent :data="[globalVars]" />
     <MyComponent :data="{ index: globalVars }" />
+    <MyComponent :callback="() => someFunction(someArgs, globalVars)" />
   </template>
 
   <Child>
     <template #default="{ foo }">
+      <MyComponent :data="[globalVars]" />
       <MyComponent :data="{ val: globalVars }" />
+      <MyComponent :data="() => someFunction(someArgs, globalVars)" />
     </template>
   </Child>
 </template>