Vòng lặp bên trong React JSX

1390
B Robster 2014-04-05 19:29.

Tôi đang cố gắng làm điều gì đó như sau trong React JSX(trong đó ObjectRow là một thành phần riêng biệt):

<tbody>
    for (var i=0; i < numrows; i++) {
        <ObjectRow/>
    } 
</tbody>

Tôi nhận ra và hiểu tại sao điều này không hợp lệ JSX, vì JSXbản đồ để gọi hàm. Tuy nhiên, đến từ đất mẫu và là người mới JSX, tôi không chắc mình sẽ đạt được điều trên như thế nào (thêm một thành phần nhiều lần).

30 answers

1308
Sophie Alpert 2014-04-05 19:39.

Hãy nghĩ về nó giống như bạn chỉ đang gọi các hàm JavaScript. Bạn không thể sử dụng một forvòng lặp trong đó các đối số của một lệnh gọi hàm sẽ đi:

return tbody(
    for (var i = 0; i < numrows; i++) {
        ObjectRow()
    } 
)

Xem cách hàm tbodyđang được truyền một forvòng lặp làm đối số - dẫn đến lỗi cú pháp.

Nhưng bạn có thể tạo một mảng và sau đó chuyển nó vào dưới dạng đối số:

var rows = [];
for (var i = 0; i < numrows; i++) {
    rows.push(ObjectRow());
}
return tbody(rows);

Về cơ bản, bạn có thể sử dụng cùng một cấu trúc khi làm việc với JSX:

var rows = [];
for (var i = 0; i < numrows; i++) {
    // note: we are adding a key prop here to allow react to uniquely identify each
    // element in this array. see: https://reactjs.org/docs/lists-and-keys.html
    rows.push(<ObjectRow key={i} />);
}
return <tbody>{rows}</tbody>;

Thật ngẫu nhiên, ví dụ JavaScript của tôi gần như chính xác là ví dụ về JSX đó biến đổi thành. Chơi xung quanh với Babel REPL để cảm nhận cách hoạt động của JSX.

902
Brigand 2014-04-05 19:46.

Không chắc liệu điều này có hiệu quả với tình huống của bạn hay không, nhưng thường thì bản đồ là một câu trả lời hay.

Nếu đây là mã của bạn với vòng lặp for:

<tbody>
    for (var i=0; i < objects.length; i++) {
        <ObjectRow obj={objects[i]} key={i}>
    } 
</tbody>

Bạn có thể viết nó như thế này với bản đồ :

<tbody>
    {objects.map(function(object, i){
        return <ObjectRow obj={object} key={i} />;
    })}
</tbody>

Cú pháp ES6:

<tbody>
    {objects.map((object, i) => <ObjectRow obj={object} key={i} />)}
</tbody>
472
JMM 2015-04-15 04:08.

Nếu bạn chưa có mảng để map()thích câu trả lời của @ FakeRainBrigand và muốn nội dòng điều này để bố cục nguồn tương ứng với đầu ra gần hơn câu trả lời của @ SophieAlpert:

Với cú pháp ES2015 (ES6) (chức năng lây lan và mũi tên)

http://plnkr.co/edit/mfqFWODVy8dKQQOkIEGV?p=preview

<tbody>
  {[...Array(10)].map((x, i) =>
    <ObjectRow key={i} />
  )}
</tbody>

Re: Transpiling với Babel, trang cảnh báo của nó nói rằng điều đó Array.fromlà cần thiết để lây lan, nhưng hiện tại ( v5.8.23) điều đó dường như không đúng với trường hợp phát tán một thực tế Array. Tôi có một vấn đề tài liệu mở để làm rõ điều đó. Nhưng sử dụng có rủi ro của riêng bạn hoặc polyfill.

Vanilla ES5

Array.apply

<tbody>
  {Array.apply(0, Array(10)).map(function (x, i) {
    return <ObjectRow key={i} />;
  })}
</tbody>

Nội tuyến IIFE

http://plnkr.co/edit/4kQjdTzd4w69g8Suu2hT?p=preview

<tbody>
  {(function (rows, i, len) {
    while (++i <= len) {
      rows.push(<ObjectRow key={i} />)
    }
    return rows;
  })([], 0, 10)}
</tbody>

Kết hợp các kỹ thuật từ các câu trả lời khác

Giữ bố cục nguồn tương ứng với đầu ra, nhưng làm cho phần nội tuyến nhỏ gọn hơn:

render: function () {
  var rows = [], i = 0, len = 10;
  while (++i <= len) rows.push(i);

  return (
    <tbody>
      {rows.map(function (i) {
        return <ObjectRow key={i} index={i} />;
      })}
    </tbody>
  );
}

Với cú pháp & Arrayphương thức ES2015

Với Array.prototype.fillbạn, bạn có thể thực hiện điều này như một giải pháp thay thế cho việc sử dụng spread như minh họa ở trên:

<tbody>
  {Array(10).fill(1).map((el, i) =>
    <ObjectRow key={i} />
  )}
</tbody>

(Tôi nghĩ rằng bạn thực sự có thể bỏ qua bất kỳ đối số nào fill(), nhưng tôi không hoàn toàn tin tưởng vào điều đó.) Cảm ơn @FakeRainBrigand đã sửa lỗi của tôi trong phiên bản fill()giải pháp trước đó (xem bản sửa đổi).

key

Trong mọi trường hợp, phần keyđính kèm làm giảm bớt cảnh báo với bản xây dựng phát triển, nhưng không thể truy cập được ở trẻ. Bạn có thể vượt qua một phần bổ sung nếu bạn muốn chỉ mục có sẵn trong phần tử con. Xem Danh sách và Phím để thảo luận.

93
danielfeelfine 2016-10-30 18:35.

Đơn giản chỉ cần sử dụng phương thức Mảng bản đồ với cú pháp ES6:

<tbody>
  {items.map(item => <ObjectRow key={item.id} name={item.name} />)} 
</tbody>

Đừng quên keytài sản.

90
Alireza 2017-05-17 03:37.

Sử dụng chức năng bản đồ Mảng là một cách rất phổ biến để lặp qua Mảng các phần tử và tạo các thành phần theo chúng trong React , đây là một cách tuyệt vời để thực hiện một vòng lặp, một cách khá hiệu quả và gọn gàng để thực hiện các vòng lặp của bạn trong JSX , Đó là không phải là cách duy nhất để làm điều đó, mà là cách ưa thích.

Ngoài ra, đừng quên có một Khóa duy nhất cho mỗi lần lặp theo yêu cầu. Hàm bản đồ tạo chỉ mục duy nhất từ ​​0 nhưng bạn không nên sử dụng chỉ mục đã tạo nhưng nếu giá trị của bạn là duy nhất hoặc nếu có khóa duy nhất, bạn có thể sử dụng chúng:

<tbody>
  {numrows.map(x=> <ObjectRow key={x.id} />)}
</tbody>

Ngoài ra, vài dòng từ MDN nếu bạn không quen với chức năng bản đồ trên Array:

bản đồ gọi một hàm gọi lại được cung cấp một lần cho mỗi phần tử trong một mảng, theo thứ tự và xây dựng một mảng mới từ kết quả. gọi lại chỉ được gọi cho các chỉ mục của mảng có các giá trị được gán, bao gồm cả không xác định. Nó không được gọi cho các phần tử bị thiếu của mảng (nghĩa là các chỉ mục chưa bao giờ được đặt, đã bị xóa hoặc chưa bao giờ được gán giá trị).

callback được gọi với ba đối số: giá trị của phần tử, chỉ số của phần tử và đối tượng Array đang được duyệt.

Nếu một tham số thisArg được cung cấp cho bản đồ, nó sẽ được sử dụng làm giá trị này của lệnh gọi lại. Nếu không, giá trị không xác định sẽ được sử dụng làm giá trị này của nó. Giá trị này cuối cùng có thể quan sát được bằng lệnh gọi lại được xác định theo các quy tắc thông thường để xác định giá trị này được nhìn thấy bởi một hàm.

map không thay đổi mảng mà nó được gọi (mặc dù lệnh gọi lại, nếu được gọi, có thể làm như vậy).

61
mpen 2015-10-05 19:35.

Nếu bạn đang sử dụng lodash, _.timeschức năng này rất hữu ích.

import React, { Component } from "react";
import Select from "./Select";
import _ from "lodash";

export default class App extends Component {
  render() {
    return (
      <div className="container">
        <ol>
          {_.times(3, (i) => (
            <li key={i}>
              <Select onSelect={this.onSelect}>
                <option value="1">bacon</option>
                <option value="2">cheez</option>
              </Select>
            </li>
          ))}
        </ol>
      </div>
    );
  }
}
45
Brandon Sibeitokgong 2016-01-04 19:53.

Bạn cũng có thể giải nén bên ngoài khối trả về:

render: function() {
    var rows = [];
    for (var i = 0; i < numrows; i++) {
        rows.push(<ObjectRow key={i}/>);
    } 

    return (<tbody>{rows}</tbody>);
}
37
Etai 2015-02-03 09:35.

Tôi biết đây là một chủ đề cũ, nhưng bạn có thể muốn xem các Mẫu React , cho phép bạn sử dụng các mẫu kiểu jsx trong phản ứng, với một vài lệnh (chẳng hạn như rt-repeat).

Ví dụ của bạn, nếu bạn sử dụng các mẫu phản ứng, sẽ là:

<tbody>
     <ObjectRow rt-repeat="obj in objects"/>
</tbody>
32
Yangshun Tay 2017-06-02 17:12.

Có nhiều cách để thực hiện việc này. JSX cuối cùng được biên dịch sang JavaScript, vì vậy, miễn là bạn đang viết JavaScript hợp lệ, bạn sẽ giỏi.

Câu trả lời của tôi nhằm mục đích tổng hợp tất cả những cách tuyệt vời đã được trình bày ở đây:

Nếu bạn không có mảng đối tượng, chỉ cần số hàng:

trong returnkhối, tạo Arrayvà sử dụng Array.prototype.map:

render() {
  return (
    <tbody>
      {Array(numrows).fill(null).map((value, index) => (
        <ObjectRow key={index}>
      ))}
    </tbody>
  );
}

bên ngoài returnkhối, chỉ cần sử dụng vòng lặp JavaScript thông thường:

render() {
  let rows = [];
  for (let i = 0; i < numrows; i++) {
    rows.push(<ObjectRow key={i}/>);
  } 
  return (
    <tbody>{rows}</tbody>
  );
}

biểu thức hàm được gọi ngay lập tức:

render() {
  return (
    <tbody>
      {() => {
        let rows = [];
        for (let i = 0; i < numrows; i++) {
          rows.push(<ObjectRow key={i}/>);
        }
        return rows;
      }}
    </tbody>
  );
}

Nếu bạn có một mảng các đối tượng

trong returnkhối, .map()mỗi đối tượng cho một <ObjectRow>thành phần:

render() {
  return (
    <tbody>
      {objectRows.map((row, index) => (
        <ObjectRow key={index} data={row} />
      ))}
    </tbody>
  );
}

bên ngoài returnkhối, chỉ cần sử dụng vòng lặp JavaScript thông thường:

render() {
  let rows = [];
  for (let i = 0; i < objectRows.length; i++) {
    rows.push(<ObjectRow key={i} data={objectRows[i]} />);
  } 
  return (
    <tbody>{rows}</tbody>
  );
}

biểu thức hàm được gọi ngay lập tức:

render() {
  return (
    <tbody>
      {(() => {
        const rows = [];
        for (let i = 0; i < objectRows.length; i++) {
          rows.push(<ObjectRow key={i} data={objectRows[i]} />);
        }
        return rows;
      })()}
    </tbody>
  );
}
27
lulin 2017-01-11 23:49.

nếu numrows là một mảng và nó rất đơn giản.

<tbody>
   {numrows.map(item => <ObjectRow />)}
</tbody>

Kiểu dữ liệu mảng trong React rất tốt hơn, mảng có thể khôi phục mảng mới và hỗ trợ bộ lọc, giảm, v.v.

24
Manav Sehgal 2016-05-30 10:59.

Có một số câu trả lời chỉ ra cách sử dụng mapcâu lệnh. Dưới đây là một ví dụ hoàn chỉnh bằng cách sử dụng một trình vòng lặp trong thành phần FeatureList để liệt kê các thành phần Tính năng dựa trên cấu trúc dữ liệu JSON được gọi là các tính năng .

const FeatureList = ({ features, onClickFeature, onClickLikes }) => (
  <div className="feature-list">
    {features.map(feature =>
      <Feature
        key={feature.id}
        {...feature}
        onClickFeature={() => onClickFeature(feature.id)}
        onClickLikes={() => onClickLikes(feature.id)}
      />
    )}
  </div>
); 

Bạn có thể xem toàn bộ mã FeatureList trên GitHub. Các tính năng cố định được liệt kê ở đây .

22
Jee Mok 2018-07-14 20:12.

Để lặp lại một số lần và quay lại, bạn có thể đạt được nó với sự trợ giúp của frommap:

<tbody>
  {
    Array.from(Array(i)).map(() => <ObjectRow />)
  }
</tbody>

Ở đâu i = number of times


Nếu bạn muốn gán các ID khóa duy nhất vào các thành phần được hiển thị, bạn có thể sử dụng React.Children.toArraynhư được đề xuất trong tài liệu React

React.Children.toArray

Trả về cấu trúc dữ liệu không rõ ràng con dưới dạng một mảng phẳng với các khóa được gán cho từng con. Hữu ích nếu bạn muốn thao tác các tập hợp con trong các phương thức kết xuất của mình, đặc biệt nếu bạn muốn sắp xếp lại hoặc cắt đoạn this.props.children trước khi chuyển nó xuống.

Ghi chú:

React.Children.toArray()thay đổi các phím để bảo toàn ngữ nghĩa của các mảng lồng nhau khi làm phẳng danh sách con. Nghĩa là, toArray đặt tiền tố cho mỗi khóa trong mảng được trả về để khóa của mỗi phần tử được xác định phạm vi đến mảng đầu vào chứa nó.

<tbody>
  {
    React.Children.toArray(
      Array.from(Array(i)).map(() => <ObjectRow />)
    )
  }
</tbody>
20
Jan Franz Palngipang 2016-08-20 14:15.

hãy để chúng tôi nói rằng chúng tôi có một loạt các mục ở trạng thái của bạn:

[{name: "item1", id: 1}, {name: "item2", id: 2}, {name: "item3", id: 3}]

<tbody>
    {this.state.items.map((item) => {
        <ObjectRow key={item.id} name={item.name} />
    })} 
</tbody>
20
bharadhwaj 2016-11-21 23:46.

Nếu bạn chọn chuyển đổi phương thức này bên trong return () của phương thức kết xuất , thì tùy chọn dễ nhất sẽ là sử dụng phương thức map () . Ánh xạ mảng của bạn thành cú pháp JSX bằng cách sử dụng hàm map (), như được hiển thị bên dưới ( cú pháp ES6 được sử dụng ).


Thành phần mẹ bên trong :

<tbody>
   { objectArray.map(object => <ObjectRow key={object.id} object={object.value}>) }
</tbody>

Hãy lưu ý keythuộc tính được thêm vào thành phần con của bạn. Nếu không cung cấp thuộc tính khóa, bạn có thể thấy cảnh báo sau trên bảng điều khiển của mình.

Cảnh báo: Mỗi phần tử con trong một mảng hoặc trình vòng lặp phải có một chỗ dựa "khóa" duy nhất.

Lưu ý: Một sai lầm phổ biến mà mọi người thường làm là sử dụng indexas key khi lặp lại, việc sử dụng indexphần tử làm khóa là một cách chống lại mẫu và bạn có thể đọc thêm về nó tại đây . Tóm lại, nếu nó KHÔNG phải là một danh sách tĩnh thì không bao giờ sử dụng indexlàm khóa.


Bây giờ tại thành phần ObjectRow , bạn có thể truy cập đối tượng từ các thuộc tính của nó.

Bên trong thành phần ObjectRow

const { object } = this.props

hoặc là

const object = this.props.object

Điều này sẽ tìm nạp cho bạn đối tượng mà bạn đã truyền từ thành phần mẹ sang biến objecttrong thành phần ObjectRow . Bây giờ bạn có thể rút ra các giá trị trong đối tượng đó theo mục đích của bạn.


Người giới thiệu :

phương thức map () trong Javascript

ECMA Script 6 hoặc ES6

16
David Q Hogan 2016-12-29 05:47.

Khả năng ES2015 / Babel đang sử dụng hàm trình tạo để tạo một mảng JSX:

function* jsxLoop(times, callback)
{
    for(var i = 0; i < times; ++i)
        yield callback(i);
}

...

<tbody>
    {[...jsxLoop(numrows, i =>
        <ObjectRow key={i}/>
    )]}
</tbody>
16
Do Async 2017-10-28 03:08.

ES2015 Array.from với chức năng bản đồ + phím

Nếu bạn không có gì để .map()bạn có thể sử dụng Array.from()với các mapchức năng để các yếu tố lặp lại:

<tbody>
  {Array.from({ length: 5 }, (value, key) => <ObjectRow key={key} />)}
</tbody>
16
J C 2017-01-25 23:44.

Tôi sử dụng cái này:

gridItems = this.state.applications.map(app =>
          <ApplicationItem key={app.Id} app={app } />
);

Tái bút: đừng bao giờ quên chìa khóa nếu không bạn sẽ có rất nhiều cảnh báo!

15
Rafi Ud Daula Refat 2016-05-22 08:39.

... Hoặc bạn cũng có thể chuẩn bị một mảng các đối tượng và ánh xạ nó thành một hàm để có kết quả đầu ra mong muốn. Tôi thích điều này hơn, vì nó giúp tôi duy trì hoạt động viết mã tốt mà không có logic bên trong việc trả về kết xuất.

render() {
const mapItem = [];
for(let i =0;i<item.length;i++) 
  mapItem.push(i);
const singleItem => (item, index) {
 // item the single item in the array 
 // the index of the item in the array
 // can implement any logic here
 return (
  <ObjectRow/>
)

}
  return(
   <tbody>{mapItem.map(singleItem)}</tbody>
  )
}
15
Joshua Michael Waggoner 2017-05-28 05:29.

Đơn giản chỉ cần sử dụng .map()để lặp lại bộ sưu tập của bạn và trả lại <ObjectRow>các vật phẩm có đạo cụ từ mỗi lần lặp lại.

Giả sử objectslà một mảng ở đâu đó ...

<tbody>
  { objects.map((obj, index) => <ObjectRow obj={ obj } key={ index }/> ) }
</tbody>
13
Adam Donahue 2016-04-01 15:45.

Tôi có xu hướng ủng hộ một cách tiếp cận trong đó logic lập trình xảy ra bên ngoài giá trị trả về của render. Điều này giúp giữ cho những gì thực sự được hiển thị dễ dàng tìm kiếm.

Vì vậy, tôi có thể sẽ làm một cái gì đó như:

import _ from 'lodash';

...

const TableBody = ({ objects }) => {
  const objectRows = objects.map(obj => <ObjectRow object={obj} />);      

  return <tbody>{objectRows}</tbody>;
} 

Phải thừa nhận rằng đây là một lượng mã nhỏ nên nội tuyến nó có thể hoạt động tốt.

12
Jurgo Boemo 2016-09-26 23:26.

tất nhiên bạn có thể giải quyết bằng .map như được gợi ý bởi câu trả lời khác. Nếu bạn đã sử dụng babel, bạn có thể nghĩ đến việc sử dụng jsx-control-statement. Chúng yêu cầu một chút thiết lập, nhưng tôi nghĩ nó đáng giá về khả năng đọc (đặc biệt là đối với nhà phát triển non-react). Nếu bạn sử dụng linter, cũng có các câu lệnh eslint-plugin-jsx-control-

12
hlissnake 2015-06-26 23:24.

Mã JSX của bạn sẽ biên dịch thành mã JavaScript thuần túy, bất kỳ thẻ nào sẽ được thay thế bằng ReactElementcác đối tượng. Trong JavaScript, bạn không thể gọi một hàm nhiều lần để thu thập các biến trả về của chúng.

Đó là bất hợp pháp, cách duy nhất là sử dụng một mảng để lưu trữ các biến trả về của hàm.

Hoặc bạn có thể sử dụng Array.prototype.mapcó sẵn kể từ JavaScript ES5 để xử lý tình huống này.

Có lẽ chúng ta có thể viết trình biên dịch khác để tạo lại cú pháp JSX mới để triển khai một hàm lặp lại giống như Angularng-repeat .

12
abhirathore2006 2016-06-03 09:37.

Điều này có thể được thực hiện theo nhiều cách.

  1. Như đã đề xuất ở trên, trước khi returnlưu trữ tất cả các phần tử trong mảng

  2. Vòng vào bên trong return

    Phương pháp 1

     let container =[];
        let arr = [1,2,3] //can be anything array, object 
    
        arr.forEach((val,index)=>{
          container.push(<div key={index}>
                         val
                         </div>)
            /** 
            * 1. All loop generated elements require a key 
            * 2. only one parent element can be placed in Array
            * e.g. container.push(<div key={index}>
                                        val
                                  </div>
                                  <div>
                                  this will throw error
                                  </div>  
                                )
            **/   
        });
        return (
          <div>
             <div>any things goes here</div>
             <div>{container}</div>
          </div>
        )
    

    Phương pháp 2

       return(
         <div>
         <div>any things goes here</div>
         <div>
            {(()=>{
              let container =[];
              let arr = [1,2,3] //can be anything array, object 
              arr.forEach((val,index)=>{
                container.push(<div key={index}>
                               val
                               </div>)
                             });
                        return container;     
            })()}
    
         </div>
      </div>
    )
    
12
Javasamurai 2016-12-03 02:17.

Đây là một giải pháp đơn giản cho nó.

var Object_rows = [];
for (var i = 0; i < numrows; i++) {
  Object_rows.push(<ObjectRow />);
}
<tbody>{Object_rows}</tbody>;

Không cần ánh xạ và mã phức tạp. Bạn chỉ cần đẩy các hàng vào mảng và trả về các giá trị để hiển thị nó.

9
Rohit Jindal 2017-01-22 04:18.

Vì bạn đang viết cú pháp Javascript bên trong mã JSX, bạn cần đặt Javascript của mình trong dấu ngoặc nhọn.

row = () => {
   var rows = [];
   for (let i = 0; i<numrows; i++) {
       rows.push(<ObjectRow/>);
   }
   return rows;
}
<tbody>
{this.row()}  
</tbody>
9
Fba Shad 2017-09-22 08:02.

Bạn cũng có thể sử dụng một chức năng tự gọi:

return <tbody>
           {(() => {
              let row = []
              for (var i = 0; i < numrows; i++) {
                  row.push(<ObjectRow key={i} />)
              }
              return row

           })()}
        </tbody>
9
Sinka Lee 2017-05-29 04:16.

Đây là một mẫu từ tài liệu React: JavaScript Expressions as Children

function Item(props) {
  return <li>{props.message}</li>;
}

function TodoList() {
  const todos = ['finish doc', 'submit pr', 'nag dan to review'];
  return (
    <ul>
      {todos.map((message) => <Item key={message} message={message} />)}
    </ul>
  );
}

như trường hợp của bạn, tôi khuyên bạn nên viết như thế này:

function render() {
  return (
    <tbody>
      {numrows.map((roe, index) => <ObjectRow key={index} />)}
    </tbody>
  );
}

Xin lưu ý rằng Key rất quan trọng, vì React sử dụng Key để khác nhau dữ liệu trong mảng.

9
Sampath 2017-04-18 23:28.

Tôi sử dụng nó như

<tbody>
  { numrows ? (
     numrows.map(obj => { return <ObjectRow /> }) 
    ) : null
  }
</tbody>
8

Bạn có thể làm điều gì đó như:

let foo = [1,undefined,3]
{ foo.map(e => !!e ? <Object /> : null )}
8
Christophe Pouliot 2017-07-08 07:10.

Câu hỏi tuyệt vời.

Những gì tôi làm khi muốn thêm một số thành phần nhất định là sử dụng một hàm trợ giúp.

Xác định một hàm trả về JSX:

const myExample = () => {
    let myArray = []
    for(let i = 0; i<5;i++) {
        myArray.push(<MyComponent/>)
    }
    return myArray
}

//... in JSX

<tbody>
    {myExample()}
</tbody>

Related questions

MORE COOL STUFF

Cate Blanchett chia tay chồng sau 3 ngày bên nhau và vẫn kết hôn với anh ấy 25 năm sau

Cate Blanchett chia tay chồng sau 3 ngày bên nhau và vẫn kết hôn với anh ấy 25 năm sau

Cate Blanchett đã bất chấp những lời khuyên hẹn hò điển hình khi cô gặp chồng mình.

Tại sao Michael Sheen là một diễn viên phi lợi nhuận

Tại sao Michael Sheen là một diễn viên phi lợi nhuận

Michael Sheen là một diễn viên phi lợi nhuận nhưng chính xác thì điều đó có nghĩa là gì?

Hallmark Star Colin Egglesfield Các món ăn gây xúc động mạnh đối với người hâm mộ tại RomaDrama Live! [Loại trừ]

Hallmark Star Colin Egglesfield Các món ăn gây xúc động mạnh đối với người hâm mộ tại RomaDrama Live! [Loại trừ]

Ngôi sao của Hallmark Colin Egglesfield chia sẻ về những cuộc gặp gỡ với người hâm mộ ly kỳ tại RomaDrama Live! cộng với chương trình INSPIRE của anh ấy tại đại hội.

Tại sao bạn không thể phát trực tuyến 'chương trình truyền hình phía Bắc'

Tại sao bạn không thể phát trực tuyến 'chương trình truyền hình phía Bắc'

Bạn sẽ phải phủi sạch đầu đĩa Blu-ray hoặc DVD để xem tại sao Northern Exposure trở thành một trong những chương trình nổi tiếng nhất của thập niên 90.

Where in the World Are You? Take our GeoGuesser Quiz

Where in the World Are You? Take our GeoGuesser Quiz

The world is a huge place, yet some GeoGuessr players know locations in mere seconds. Are you one of GeoGuessr's gifted elite? Take our quiz to find out!

8 công dụng tuyệt vời của Baking Soda và Giấm

8 công dụng tuyệt vời của Baking Soda và Giấm

Bạn biết đấy, hai sản phẩm này là nguồn điện để làm sạch, riêng chúng. Nhưng cùng với nhau, chúng có một loạt công dụng hoàn toàn khác.

Hạn hán, biến đổi khí hậu đe dọa tương lai của thủy điện Hoa Kỳ

Hạn hán, biến đổi khí hậu đe dọa tương lai của thủy điện Hoa Kỳ

Thủy điện rất cần thiết cho lưới điện của Hoa Kỳ, nhưng nó chỉ tạo ra năng lượng khi có nước di chuyển. Bao nhiêu nhà máy thủy điện có thể gặp nguy hiểm khi các hồ và sông cạn kiệt?

Quyên góp tóc của bạn để giúp giữ nước sạch của chúng tôi

Quyên góp tóc của bạn để giúp giữ nước sạch của chúng tôi

Tóc tỉa từ các tiệm và các khoản quyên góp cá nhân có thể được tái sử dụng như những tấm thảm thấm dầu và giúp bảo vệ môi trường.

Trong Saturday Night Live, The Bachelor is Bland và Tina Fey trở lại với vai 'Crazy' Sarah Palin

Trong Saturday Night Live, The Bachelor is Bland và Tina Fey trở lại với vai 'Crazy' Sarah Palin

Sau khi Sarah Palin tán thành Donald Trump vào đầu tuần này, gần như không thể tránh khỏi việc Tina Fey sẽ trở lại Saturday Night Live để thăm lại ấn tượng Palin cổ điển của cô. Và Fey chắc chắn đã không làm thất vọng, cô ấy đã đưa ra một lời khen ngợi không hề nhẹ về bài phát biểu chứng thực Iowa quanh co và khó hiểu của Palin trong khi Trump của Darrell Hammond đưa ra bình luận xuyên suốt.

Đây có phải là sự khởi đầu cho sự kết thúc của việc giam giữ Brittney Griner?

Đây có phải là sự khởi đầu cho sự kết thúc của việc giam giữ Brittney Griner?

Brittney Griner (r.) Ngay từ đầu, thân phận của Brittney Griner đã là tình huống con tin Mỹ độc nhất trong lịch sử hiện đại.

Tom Brady là bộ tứ vệ đầu tiên cuối cùng có thể giúp Julio Jones có hơn 10 lần chạm bóng trong một mùa giải

Tom Brady là bộ tứ vệ đầu tiên cuối cùng có thể giúp Julio Jones có hơn 10 lần chạm bóng trong một mùa giải

Chúng ta có thể thấy nhiều hơn nữa về một Julio Jones khỏe mạnh trong khu vực cuối năm nay. John Parker Wilson, Greg McElroy, A.

Đó phải là Đức

Đó phải là Đức

Đối với đội tuyển Anh, không có kẻ thủ ác nào lớn hơn Hầu hết các cổ động viên Anh, nếu không muốn nói là tất cả, hẳn sẽ phải gật gù khi tiếng còi mãn cuộc của trận bán kết lượt về W Euro 2022 vang lên. Bởi vì nó báo hiệu rằng Đức sẽ chờ đợi ở Wembley trong trận chung kết với Anh và là điều duy nhất giữa Anh và chiếc cúp lớn đầu tiên của đội tuyển nữ.

Nicky Hilton Forced to Borrow Paris' 'I Love Paris' Sweatshirt After 'Airline Loses All [My] Luggage'

Nicky Hilton Forced to Borrow Paris' 'I Love Paris' Sweatshirt After 'Airline Loses All [My] Luggage'

Nicky Hilton Rothschild's luggage got lost, but luckily she has an incredible closet to shop: Sister Paris Hilton's!

Kate Middleton dành một ngày bên bờ nước ở London, cùng với Jennifer Lopez, Julianne Hough và hơn thế nữa

Kate Middleton dành một ngày bên bờ nước ở London, cùng với Jennifer Lopez, Julianne Hough và hơn thế nữa

Kate Middleton dành một ngày bên bờ nước ở London, cùng với Jennifer Lopez, Julianne Hough và hơn thế nữa. Từ Hollywood đến New York và mọi nơi ở giữa, hãy xem các ngôi sao yêu thích của bạn đang làm gì!

17 tuổi bị đâm chết trong khi 4 người khác bị thương trong một cuộc tấn công bằng dao trên sông Wisconsin

17 tuổi bị đâm chết trong khi 4 người khác bị thương trong một cuộc tấn công bằng dao trên sông Wisconsin

Các nhà điều tra đang xem xét liệu nhóm và nghi phạm có biết nhau trước vụ tấn công hay không

Thanh thiếu niên, Gia đình Florida Hội đồng quản trị trường học về Luật 'Không nói đồng tính': 'Buộc chúng tôi tự kiểm duyệt'

Thanh thiếu niên, Gia đình Florida Hội đồng quản trị trường học về Luật 'Không nói đồng tính': 'Buộc chúng tôi tự kiểm duyệt'

Vụ kiện, nêu tên một số học khu, lập luận rằng dự luật "Không nói đồng tính" được ban hành gần đây của Florida "có hiệu quả im lặng và xóa bỏ học sinh và gia đình LGBTQ +"

Đường băng hạ cánh

Đường băng hạ cánh

Cuối hè đầu thu là mùa hoài niệm. Những chiếc đèn đường chiếu ánh sáng của chúng qua những con đường đẫm mưa, và những chiếc lá dưới chân - màu đỏ cam tắt trong bóng chạng vạng - là lời nhắc nhở về những ngày đã qua.

Hãy tưởng tượng tạo ra một chiến lược nội dung thực sự CHUYỂN ĐỔI. Nó có thể.

Hãy tưởng tượng tạo ra một chiến lược nội dung thực sự CHUYỂN ĐỔI. Nó có thể.

Vào năm 2021, tôi khuyến khích bạn suy nghĩ lại mọi thứ bạn biết về khách hàng mà bạn phục vụ và những câu chuyện bạn kể cho họ. Lùi lại.

Sự mất mát của voi ma mút đã mở ra trái tim tôi để yêu

Sự mất mát của voi ma mút đã mở ra trái tim tôi để yêu

Vào ngày sinh nhật thứ 9 của Felix The Cat, tôi nhớ về một trong những mất mát lớn nhất trong cuộc đời trưởng thành của tôi - Sophie của tôi vào năm 2013. Tôi đã viết bài luận này và chia sẻ nó trên nền tảng này một thời gian ngắn vào năm 2013.

Khi bạn không thể trở thành người mà Internet muốn bạn trở thành

Khi bạn không thể trở thành người mà Internet muốn bạn trở thành

Tôi ghét từ "tàu đắm". Mọi người cảm thấy thoải mái trong la bàn đạo đức của riêng mình, và khi làm như vậy, họ thấy mình vượt qua sự phán xét.

Language