-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathatom.xml
More file actions
80 lines (40 loc) · 33 KB
/
atom.xml
File metadata and controls
80 lines (40 loc) · 33 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<title>Louis Blog</title>
<link href="http://example.com/atom.xml" rel="self"/>
<link href="http://example.com/"/>
<updated>2022-04-20T14:31:23.843Z</updated>
<id>http://example.com/</id>
<author>
<name>Louis</name>
</author>
<generator uri="https://hexo.io/">Hexo</generator>
<entry>
<title>axios</title>
<link href="http://example.com/2022/04/14/axios/"/>
<id>http://example.com/2022/04/14/axios/</id>
<published>2022-04-14T05:15:12.000Z</published>
<updated>2022-04-20T14:31:23.843Z</updated>
<content type="html"><![CDATA[<h2 id="axios"><a href="#axios" class="headerlink" title="axios"></a>axios</h2><p>axios是一个专注于网络请求的库！</p><h3 id="axios-的基本使用"><a href="#axios-的基本使用" class="headerlink" title="axios 的基本使用"></a>axios 的基本使用</h3><p>1.发起GET请求</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="title function_">axios</span>({</span><br><span class="line"> <span class="comment">//请求方式</span></span><br><span class="line"> <span class="attr">method</span>:<span class="string">'GET'</span>,</span><br><span class="line"> <span class="comment">//请求地址</span></span><br><span class="line"> <span class="attr">url</span>:<span class="string">'http://www.xxx.com'</span>,</span><br><span class="line"> <span class="comment">//url中的查询参数(GET)</span></span><br><span class="line"> <span class="attr">params</span>:{</span><br><span class="line"> <span class="attr">id</span>:<span class="number">1</span></span><br><span class="line"> },</span><br><span class="line"> }).<span class="title function_">then</span>(<span class="keyword">function</span>(<span class="params">result</span>){</span><br><span class="line"> <span class="variable language_">console</span>.<span class="title function_">log</span>(result);</span><br><span class="line"> })</span><br></pre></td></tr></table></figure><p>2.发起POST请求</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><span class="line"><body></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">button</span> <span class="attr">id</span>=<span class="string">"btnPost"</span>></span>发起POST请求<span class="tag"></<span class="name">button</span>></span></span></span><br><span class="line"></body></span><br><span class="line"><script></span><br><span class="line"> <span class="variable language_">document</span>.<span class="title function_">querySelector</span>(<span class="string">'#btnPost'</span>).<span class="title function_">addEventListener</span>(<span class="string">'click'</span>,<span class="keyword">async</span> <span class="keyword">function</span>(<span class="params"></span>){</span><br><span class="line"> <span class="comment">//如果调用某个方法返回值是Promise实例，则前面可以添加await</span></span><br><span class="line"> <span class="comment">//await 只能用在被async "修饰"的方法中</span></span><br><span class="line"> <span class="keyword">const</span> {data}=<span class="keyword">await</span> <span class="title function_">axios</span>({</span><br><span class="line"> <span class="attr">method</span>:<span class="string">'POST'</span>,</span><br><span class="line"> <span class="attr">url</span>:<span class="string">'http://www.liulongbin.top:3006/api/post'</span>,</span><br><span class="line"> <span class="attr">data</span>:{</span><br><span class="line"> <span class="attr">name</span>:<span class="string">'zs'</span>,</span><br><span class="line"> <span class="attr">age</span>:<span class="number">20</span></span><br><span class="line"> },</span><br><span class="line"> })</span><br><span class="line"> <span class="variable language_">console</span>.<span class="title function_">log</span>(data);</span><br><span class="line">})</span><br></pre></td></tr></table></figure><p>3.axios.get 和axios.post</p><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br></pre></td><td class="code"><pre><span class="line"><body></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">button</span> <span class="attr">id</span>=<span class="string">"btnGET"</span>></span>GET<span class="tag"></<span class="name">button</span>></span></span></span><br><span class="line"> <span class="language-xml"><span class="tag"><<span class="name">button</span> <span class="attr">id</span>=<span class="string">"btnPOST"</span>></span>POST<span class="tag"></<span class="name">button</span>></span></span></span><br><span class="line"></body></span><br><span class="line"><span class="language-xml"><span class="tag"><<span class="name">script</span>></span><span class="language-javascript"></span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml">(axios.<span class="property">get</span>的写法）</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="variable language_">document</span>.<span class="title function_">querySelector</span>(<span class="string">'#btnGET'</span>).<span class="title function_">addEventListener</span>(<span class="string">'click'</span>,<span class="keyword">async</span> <span class="keyword">function</span>(<span class="params"></span>){</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="comment">/* axios.get('url地址',{</span></span></span></span><br><span class="line"><span class="comment"><span class="language-javascript"><span class="language-xml"> //GET参数</span></span></span></span><br><span class="line"><span class="comment"><span class="language-javascript"><span class="language-xml"> params:{}</span></span></span></span><br><span class="line"><span class="comment"><span class="language-javascript"><span class="language-xml"> }) */</span></span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="keyword">const</span> {<span class="attr">data</span>:res} =<span class="keyword">await</span> axios.<span class="title function_">get</span>(<span class="string">'http://www.liulongbin.top:3006/api/getbooks'</span>,{</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="attr">params</span>:{<span class="attr">id</span>:<span class="number">1</span>}</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> })</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="variable language_">console</span>.<span class="title function_">log</span>(res);</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml">})</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml">(axios.<span class="property">post</span>的写法)</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="variable language_">document</span>.<span class="title function_">querySelector</span>(<span class="string">'#btnPOST'</span>).<span class="title function_">addEventListener</span>(<span class="string">'click'</span>,<span class="keyword">async</span> <span class="keyword">function</span>(<span class="params"></span>){</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="comment">/*axios.post('url地址',//POST参数{})*/</span></span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="keyword">const</span> {<span class="attr">data</span>:res}=<span class="keyword">await</span> axios.<span class="title function_">post</span>(<span class="string">'http://www.liulongbin.top:3006/api/post'</span>,{<span class="attr">name</span>:<span class="string">'zs'</span>,<span class="attr">gender</span>:<span class="string">'女'</span>})</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> <span class="variable language_">console</span>.<span class="title function_">log</span>(res);</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"> })</span></span></span><br><span class="line"><span class="language-javascript"><span class="language-xml"></span><span class="tag"></<span class="name">script</span>></span></span></span><br></pre></td></tr></table></figure>]]></content>
<summary type="html"><h2 id="axios"><a href="#axios" class="headerlink" title="axios"></a>axios</h2><p>axios是一个专注于网络请求的库！</p>
<h3 id="axios-的基本使用"><a href="#axio</summary>
</entry>
<entry>
<title>Vue列表过滤</title>
<link href="http://example.com/2022/04/07/Vue%E5%88%97%E8%A1%A8%E8%BF%87%E6%BB%A4/"/>
<id>http://example.com/2022/04/07/Vue%E5%88%97%E8%A1%A8%E8%BF%87%E6%BB%A4/</id>
<published>2022-04-07T10:30:08.000Z</published>
<updated>2022-04-14T05:18:19.505Z</updated>
<content type="html"><![CDATA[<h3 id="代码实例（watch）"><a href="#代码实例（watch）" class="headerlink" title="代码实例（watch）"></a>代码实例（watch）</h3><figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta"><!DOCTYPE <span class="keyword">html</span>></span></span><br><span class="line"><span class="tag"><<span class="name">html</span> <span class="attr">lang</span>=<span class="string">"en"</span>></span></span><br><span class="line"><span class="tag"><<span class="name">head</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">charset</span>=<span class="string">"UTF-8"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">http-equiv</span>=<span class="string">"X-UA-Compatible"</span> <span class="attr">content</span>=<span class="string">"IE=edge"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">name</span>=<span class="string">"viewport"</span> <span class="attr">content</span>=<span class="string">"width=device-width, initial-scale=1.0"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">title</span>></span>列表过滤<span class="tag"></<span class="name">title</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">script</span> <span class="attr">src</span>=<span class="string">"/js/vue.js"</span>></span><span class="tag"></<span class="name">script</span>></span></span><br><span class="line"><span class="tag"></<span class="name">head</span>></span></span><br><span class="line"><span class="tag"><<span class="name">body</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">div</span> <span class="attr">id</span>=<span class="string">"root"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">input</span> <span class="attr">type</span>=<span class="string">"text"</span> <span class="attr">placeholder</span>=<span class="string">"请输入信息"</span> <span class="attr">v-model</span>=<span class="string">"KeyWord"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">ul</span> <span class="attr">v-for</span>=<span class="string">"(p,index) in fillist"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">li</span>></span>{{p.name}}-{{p.age}}-{{p.gender}}<span class="tag"></<span class="name">li</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">ul</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">div</span>></span></span><br><span class="line"><span class="tag"></<span class="name">body</span>></span></span><br><span class="line"><span class="tag"><<span class="name">script</span> <span class="attr">type</span>=<span class="string">"text/javascript"</span>></span><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"> <span class="title class_">Vue</span>.<span class="property">config</span>.<span class="property">productionTip</span> = <span class="literal">false</span></span></span><br><span class="line"><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">new</span> <span class="title class_">Vue</span>({</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">el</span>:<span class="string">'#root'</span>,</span></span><br><span class="line"><span class="language-javascript"> <span class="title function_">data</span>(<span class="params"></span>) {</span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">return</span> {</span></span><br><span class="line"><span class="language-javascript"> <span class="title class_">KeyWord</span>:<span class="string">''</span>,</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">lists</span>:[</span></span><br><span class="line"><span class="language-javascript"> {<span class="attr">name</span>:<span class="string">'Louis'</span>,<span class="attr">age</span>:<span class="string">'18'</span>,<span class="attr">gender</span>:<span class="string">'male'</span>},</span></span><br><span class="line"><span class="language-javascript"> {<span class="attr">name</span>:<span class="string">'Louis1'</span>,<span class="attr">age</span>:<span class="string">'182'</span>,<span class="attr">gender</span>:<span class="string">'male'</span>},</span></span><br><span class="line"><span class="language-javascript"> {<span class="attr">name</span>:<span class="string">'Louis2'</span>,<span class="attr">age</span>:<span class="string">'182'</span>,<span class="attr">gender</span>:<span class="string">'female'</span>}</span></span><br><span class="line"><span class="language-javascript"> ],</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">fillist</span>:[]</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> },</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">watch</span>:{</span></span><br><span class="line"><span class="language-javascript"> <span class="title class_">KeyWord</span>:{</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">immediate</span>:<span class="literal">true</span>,</span></span><br><span class="line"><span class="language-javascript"> <span class="title function_">handler</span>(<span class="params">val</span>){</span></span><br><span class="line"><span class="language-javascript"> <span class="variable language_">this</span>.<span class="property">fillist</span> =<span class="variable language_">this</span>.<span class="property">lists</span>.<span class="title function_">filter</span>(<span class="function">(<span class="params">p</span>)=></span>{</span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">return</span> p.<span class="property">name</span>.<span class="title function_">indexOf</span>(val) !== -<span class="number">1</span></span></span><br><span class="line"><span class="language-javascript"> })</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> })</span></span><br><span class="line"><span class="language-javascript"></span><span class="tag"></<span class="name">script</span>></span></span><br><span class="line"><span class="tag"></<span class="name">html</span>></span></span><br></pre></td></tr></table></figure><h3 id="代码实例-computed"><a href="#代码实例-computed" class="headerlink" title="代码实例(computed)"></a>代码实例(computed)</h3><figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta"><!DOCTYPE <span class="keyword">html</span>></span></span><br><span class="line"><span class="tag"><<span class="name">html</span> <span class="attr">lang</span>=<span class="string">"en"</span>></span></span><br><span class="line"><span class="tag"><<span class="name">head</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">charset</span>=<span class="string">"UTF-8"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">http-equiv</span>=<span class="string">"X-UA-Compatible"</span> <span class="attr">content</span>=<span class="string">"IE=edge"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">name</span>=<span class="string">"viewport"</span> <span class="attr">content</span>=<span class="string">"width=device-width, initial-scale=1.0"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">title</span>></span>列表过滤<span class="tag"></<span class="name">title</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">script</span> <span class="attr">src</span>=<span class="string">"/js/vue.js"</span>></span><span class="tag"></<span class="name">script</span>></span></span><br><span class="line"><span class="tag"></<span class="name">head</span>></span></span><br><span class="line"><span class="tag"><<span class="name">body</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">div</span> <span class="attr">id</span>=<span class="string">"root"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">input</span> <span class="attr">type</span>=<span class="string">"text"</span> <span class="attr">placeholder</span>=<span class="string">"请输入信息"</span> <span class="attr">v-model</span>=<span class="string">"KeyWord"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">ul</span> <span class="attr">v-for</span>=<span class="string">"(p,index) in fillist"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">li</span>></span>{{p.name}}-{{p.age}}-{{p.gender}}<span class="tag"></<span class="name">li</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">ul</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">div</span>></span></span><br><span class="line"><span class="tag"></<span class="name">body</span>></span></span><br><span class="line"><span class="tag"><<span class="name">script</span> <span class="attr">type</span>=<span class="string">"text/javascript"</span>></span><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"> <span class="title class_">Vue</span>.<span class="property">config</span>.<span class="property">productionTip</span> = <span class="literal">false</span></span></span><br><span class="line"><span class="language-javascript"></span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">new</span> <span class="title class_">Vue</span>({</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">el</span>:<span class="string">'#root'</span>,</span></span><br><span class="line"><span class="language-javascript"> <span class="title function_">data</span>(<span class="params"></span>) {</span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">return</span> {</span></span><br><span class="line"><span class="language-javascript"> <span class="title class_">KeyWord</span>:<span class="string">''</span>,</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">lists</span>:[</span></span><br><span class="line"><span class="language-javascript"> {<span class="attr">name</span>:<span class="string">'Louis'</span>,<span class="attr">age</span>:<span class="string">'18'</span>,<span class="attr">gender</span>:<span class="string">'male'</span>},</span></span><br><span class="line"><span class="language-javascript"> {<span class="attr">name</span>:<span class="string">'Louis1'</span>,<span class="attr">age</span>:<span class="string">'182'</span>,<span class="attr">gender</span>:<span class="string">'male'</span>},</span></span><br><span class="line"><span class="language-javascript"> {<span class="attr">name</span>:<span class="string">'Louis2'</span>,<span class="attr">age</span>:<span class="string">'182'</span>,<span class="attr">gender</span>:<span class="string">'female'</span>}]</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> },</span></span><br><span class="line"><span class="language-javascript"> <span class="attr">computed</span>:{</span></span><br><span class="line"><span class="language-javascript"> <span class="title function_">fillist</span>(<span class="params"></span>){</span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">return</span> <span class="variable language_">this</span>.<span class="property">lists</span>.<span class="title function_">filter</span>(<span class="function">(<span class="params">p</span>)=></span>{</span></span><br><span class="line"><span class="language-javascript"> <span class="keyword">return</span> p.<span class="property">name</span>.<span class="title function_">indexOf</span>(<span class="variable language_">this</span>.<span class="property">KeyWord</span>) !== -<span class="number">1</span></span></span><br><span class="line"><span class="language-javascript"> })</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> }</span></span><br><span class="line"><span class="language-javascript"> })</span></span><br><span class="line"><span class="language-javascript"></span><span class="tag"></<span class="name">script</span>></span></span><br><span class="line"><span class="tag"></<span class="name">html</span>></span></span><br></pre></td></tr></table></figure><h3 id="分析Vue的片段（分两种方法）"><a href="#分析Vue的片段（分两种方法）" class="headerlink" title="分析Vue的片段（分两种方法）"></a>分析Vue的片段（分两种方法）</h3><p>第一种：watch(监视方法)</p><p>1.检测输入的关键字是否发生改变（在这里需要提前设定KeyWord(进行双向绑定)）</p><p>2.通过数组过滤的filter方法对设定数据p进行过滤</p><p>3.最后返回值通过indexOf判断是否包含输入的值（如果不包含会返回-1）</p><p>第二种：computed(计算属性)</p><p>计算属性大致方法与监视属性一致（详细见代码）</p>]]></content>
<summary type="html"><h3 id="代码实例（watch）"><a href="#代码实例（watch）" class="headerlink" title="代码实例（watch）"></a>代码实例（watch）</h3><figure class="highlight html"><table</summary>
</entry>
<entry>
<title>Hello World</title>
<link href="http://example.com/2022/03/18/hello-world/"/>
<id>http://example.com/2022/03/18/hello-world/</id>
<published>2022-03-18T04:02:45.759Z</published>
<updated>2022-03-18T04:02:45.759Z</updated>
<content type="html"><![CDATA[<p>Welcome to <a href="https://hexo.io/">Hexo</a>! This is your very first post. Check <a href="https://hexo.io/docs/">documentation</a> for more info. If you get any problems when using Hexo, you can find the answer in <a href="https://hexo.io/docs/troubleshooting.html">troubleshooting</a> or you can ask me on <a href="https://github.com/hexojs/hexo/issues">GitHub</a>.</p><h2 id="Quick-Start"><a href="#Quick-Start" class="headerlink" title="Quick Start"></a>Quick Start</h2><h3 id="Create-a-new-post"><a href="#Create-a-new-post" class="headerlink" title="Create a new post"></a>Create a new post</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo new <span class="string">"My New Post"</span></span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/writing.html">Writing</a></p><h3 id="Run-server"><a href="#Run-server" class="headerlink" title="Run server"></a>Run server</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo server</span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/server.html">Server</a></p><h3 id="Generate-static-files"><a href="#Generate-static-files" class="headerlink" title="Generate static files"></a>Generate static files</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo generate</span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/generating.html">Generating</a></p><h3 id="Deploy-to-remote-sites"><a href="#Deploy-to-remote-sites" class="headerlink" title="Deploy to remote sites"></a>Deploy to remote sites</h3><figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo deploy</span><br></pre></td></tr></table></figure><p>More info: <a href="https://hexo.io/docs/one-command-deployment.html">Deployment</a></p>]]></content>
<summary type="html"><p>Welcome to <a href="https://hexo.io/">Hexo</a>! This is your very first post. Check <a href="https://hexo.io/docs/">documentation</a> for</summary>
</entry>
</feed>